Question

我有这个标记：

<fieldset class="checkbxr full small" onclick="alert('test')">
    <label for="" class="fat_label">Category</label>
    <input type="checkbox" name="true_checkb" id="">
    <span class="dmy_checkb"></span>
</fieldset>

这是一些虚拟复选框解决方案。一切都很好，但我需要为整个onclick挂一个fieldset事件。因此，如果我喜欢下面，我有3个警报，对于所有元素inisde，所以我的事件发生了3次。如何仅为fieldset设置此项并进行一次事件调用？求助。

这是js和一些css：http://jsfiddle.net/VeT6y/

Answer 1

您需要根据点击的内容取消冒泡活动.... 这是一个脚本（在纯javascript中 - 在jQuery中更容易做 - 因为你可以检查事件源上是否有类例如然后取消它）。此脚本检查单击的标签是否为FIELDSET，如果它没有取消气泡，如果它是弹出警报。

小提琴http://jsfiddle.net/YK3TU/2/

代码：

HTML：

<fieldset class="checkbxr full small" onclick="javascript:doSomething()">
    <label for="" class="fat_label">Category</label>
    <input type="checkbox" name="true_checkb" id="">
    <span class="dmy_checkb"></span>
</fieldset>

使用Javascript：

function doSomething(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;
    console.log(targ)
    if (targ.tagName!="FIELDSET") {
     cancelBubble(e)   
    } else {
     doMyThing()   
    }
}
function cancelBubble(e) {
 var evt = e ? e:window.event;
 if (evt.stopPropagation)    evt.stopPropagation();
 if (evt.cancelBubble!=null) evt.cancelBubble = true;
}
function doMyThing(){
    alert("this is a test")

}

如何使用许多元素挂钩一个块事件

1 个答案: