• 实例 (用到 阻止事件冒泡 event.stopPropagation();)


    本实例的效果来自于http://uc.webdev.lesongapp.cn/recruit_shaoyang/
    登录之后 搜索技能 展示结果 可点击搜索结果的某一列表 查看效果 其实是click之后一个展开和收缩的效果 只是每一个列表下面还有click事件
    function showMoreInfo(){ var infoListItemNode = $('#search_results_container .results-list li'); infoListItemNode.click(function(e){ var thisNode = $(this), networkSectionNode = thisNode.find('.network-info-section'); //e.stopPropagation(); 这个不用写,因为他是父元素了 if(networkSectionNode.is(':hidden')){ showNetworkUI(thisNode); } else { networkSectionNode.slideUp('slow'); } }); } function showNetworkUI(selection_id){ var parentNode = $(selection_id), networkDetailsSection = parentNode.find('.network-details'); parentNode.find('.network-info-section').slideDown('slow'); //showWeiboContent(networkDetailsSection); parentNode.find('.sns-item').each(function(){ var thisNode = $(this); thisNode.click(function(e){ e.preventDefault(); e.stopPropagation(); networkDetailsSection.empty(); $.log(networkDetailsSection.children().length); if(thisNode.hasClass('sina-weibo')){ showWeiboContent(networkDetailsSection); } else if (thisNode.hasClass('tx-weibo')){ showTXWeiboContent(networkDetailsSection); } else if (thisNode.hasClass('linkedin')){ showLinkedInContent(networkDetailsSection); } else if (thisNode.hasClass('renren')){ showRenrenContent(networkDetailsSection); } else if (thisNode.hasClass('kaixin')){ showKaixinContent(networkDetailsSection); } }); }); }
  • 相关阅读:
    docker
    perl有用的字符串匹配
    nginx 反向代理 kuberntes service 出现 502 问题排查
    应用应用容器化部署最佳实践
    监控系统设计
    kubernetes events 事件机制源码分析
    golang gc 原理和内存分配
    golang 使用 websocket 实现后台消息分组推送
    kubeadm 创建的 k8s 集群的升级
    在 kubernetes pod 中构建 docker image
  • 原文地址:https://www.cnblogs.com/mabelstyle/p/2913591.html
Copyright © 2020-2023  润新知