我在标签内嵌入了很少的元素(比如输入,段落,radiobutton任何元素).此标签的父级是div标签.应用事件处理程序,用于标签内的所有元素以及除标签标记之外的父div.在所有事件处理程序中也应用了stopPropagation.但是,当我点击任何内标签的元素,然后相应的事件处理程序被调用,并且因为stopPropagation是存在的,它是制约父事件处理函数被调用.直到这里很好.但问题是它还在调用其兄弟姐妹的事件处理程序.
<div class="scroll-content-item" data-pid="1773">
<label>
<span class="custom">Custom</span>
<input type="text" class="text custom_width" id="cust_width" value="960"/>
<p class="para"> This is test para</p>
</label>
</div>
Run Code Online (Sandbox Code Playgroud)
jQuery(document).ready(function($) {
$('.para').click(function(event) {
alert("paragraph event ");
event.stopPropagation();
});
$('.custom_width').click(function(event) {
alert("input custom width event ");
event.stopPropagation();
});
$('.scroll-content-item').click(function(event) {
alert("parent div event ");
event.stopPropagation();
});
});?
Run Code Online (Sandbox Code Playgroud)
当我点击段落时,它的事件处理程序和输入类型的处理程序也会被调用.当我用类自定义单击span时,因为它没有事件处理程序,所以先调用parent,然后调用后面的输入类型处理程序.
您可能会问的问题是嵌入p,输入和标签内的所有内容的目的是什么.我们使用自定义input type="file" 我们在输入类型文件上覆盖标签数据,但是onclick必须触发标签输入类型文件.对于同样的我在标签内嵌入元素
只是想知道为什么即使我正在使用这两个事件处理程序也会被调用stopPropagation.
作为参考,我创建了jsfiddle:http://jsfiddle.net/x7xQg/29/
提前致谢
我无法理解||在Jquery/Javascript中执行的顺序.
如果我有这个:
someVar = $el.attr("one") || options.two || "three";
Run Code Online (Sandbox Code Playgroud)
它设置someVar于当两个"三" $el.attr("one")并options.two没有定义.
我需要在此语句中添加另一个条件,如下所示:
someVar = $el.attr("one") || options.two || options.extra == "true" ? undefined : "three";
Run Code Online (Sandbox Code Playgroud)
所以这应该说:
如果没有'$el.attr("one")'或'options.two'定义,请检查'options.extra == true',如果这是真的,设置为'undefined',否则置'three'.
但是,undefined即使我设置了$el.attr("one"),我也总是得到,我不明白为什么?
谁能告诉我我的逻辑有什么问题?
谢谢!