gpt4 book ai didi

javascript - 如何附加 document.click 事件而不接触某些元素?

转载 作者:行者123 更新时间:2023-11-28 20:57:31 27 4
gpt4 key购买 nike

我需要点击一个文档来调用一些函数,但问题是当我点击一些想要的元素时它没有反应,所以代码:

<body>

<div class="some_element">
some element
</div>



</body>

和js:

$(document).click(function(){

//something to happen

})

现在,如果我用 class="some_element" 单击 div,document.click 事件将被调用,但我只需要在以下情况下调用该事件:单击文档;或者有可能使这个元素成为异常(exception)?

更详细:

$('#forma').click(function(e){

e.stopPropagation();

$('#assignment_type_list').slideUp();


})

可以说#forma - 它是这些元素的父元素,所以当我单击页面时我想要向上滑动一些元素并且:

$('#assignment_type_select, #assignment_type_label').click(function(){

$('#assignment_type_list').slideToggle();

})

这是单击元素时其他元素被切换的元素,但问题是当我单击此元素时 $('#forma').click - 也会执行,因为它的父级和 e.stopPropagation() - 没有帮助。

最佳答案

所有这些 stopPropagation 内容都是正确的,尽管这会导致您的脚本在特定浏览器的旧版本上抛出错误。猜猜是哪一个?跨浏览器方式:

$('#elem').click(function(e)
{
e = e || window.event;//IE doesn't pass the event object as standard to the handler
//event would normally work, but if you declared some event variable in the current scope
//all falls to pieces, so this e || window.event; thing is to be preferred (IMO)
if (e.stopPropagation)//check if method exists
{
e.stopPropagation();
return;
}
e.cancelBubble = true;//for IE
});

但是,您想要检查实际单击的元素是否是您需要的元素。问题在于事件通过 DOM 传递的方式。在 W3C 浏览器中,事件首先传递到文档,然后向下爬到实际被单击的元素(通过 dom 传播)。
相比之下,IE 在元素本身上调度其事件,然后将其发送到文档(除了由选择元素触发的 change 事件......雪上加霜)。这实际上意味着,在 W3C 浏览器中注册到 body 元素中的单击事件可能会到达某种复选框,或者可能是空 div 内的单击。
同样,在 IE 中,当点击事件到达 body 标记时,它可能会被分派(dispatch)到页面上的任何元素。因此,在您的情况下,谷歌搜索:事件委托(delegate),或者转向 jQuery 的 .delegate() 方法,可能会很有用。

或者检查事件对象以查看是否允许该事件传播:

var target =  e.target || e.srcElement;//target now holds a reference to the clicked element

属性名称巧妙地显示了冒泡模型和传播模型之间的区别:在第一种情况 (srcElement) 中,事件来自 dom 中的源元素。在 W3C 传播模型中,事件在前往 dom 中某处的 target 元素时发生。
将其视为热寻导弹(w3c)与目标被击落后的碎片雨(即,总是具有破坏性的导弹,在这种情况下往往来不及对事件使用react,因此来不及处理它们了:P)

关于javascript - 如何附加 document.click 事件而不接触某些元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11793594/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com