热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

javascript–停止特定处理程序的传播

假设我有自定义下拉列表().单击按钮时,我想调出菜单,当用户点击菜单外部时,我希望它关闭.所以我这样做:$(myDropDown).mousedown(dropDownMouseD

假设我有自定义下拉列表().单击按钮时,我想调出菜单,当用户点击菜单外部时,我希望它关闭.所以我这样做:

$(myDropDown).mousedown(dropDownMouseDown);
$("html").mousedown(htmlMouseDown,myDropDown);
function dropDownMouseDown(event) {
event.target.open();
event.stopPropagation();//I need this line or else htmlMouseDown will be called immediately causing the dropDown-menu to close right before its opened
}
function htmlMouseDown() {
this.close();
}

嗯,这很有效.但是,如果我添加其中两个呢?如果我点击打开第一个,那么第二个相同然后两个都将打开,因为dropDownMouseDown停止传播,所以htmlMouseDown永远不会被调用第一个.
我该如何解决这个问题?
如果我只有这两个,那么添加一些逻辑当然很容易,但如果数量是动态的?另外我可能不想调用event.stopPropagation(),因为它会对我正在使用的其他库也会有什么奇怪的东西来监听那个事件呢?
我也尝试过这一行:
$( “HTML”).鼠标按下(htmlMouseDown,myDropDown)
在dropDownMouseDown-handler中,但是一旦冒泡到达html元素,它将立即被调用.

解决方法:

假设你有一个你的投影选择器,(让我们说“.dropdown”),我会尝试使用’.not()’

$('.dropdown').mousedown(dropDownMouseDown);
$("html").on('mousedown', htmlMouseDown);
function dropDownMouseDown(event) {
event.target.open();
}
function htmlMouseDown(event) {
$('.dropdown').not($(event.target)).close();
}

这里有一个与css类相同的小提琴:
http://jsfiddle.net/eFEL6/4/


推荐阅读
author-avatar
友尔哥_398
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有