第一次单击 div 时，如何使事件冒泡起作用？答案

【问题标题】：How can I get event bubbling to work when a div is clicked the first time?第一次单击 div 时，如何使事件冒泡起作用？
【发布时间】：2012-06-10 19:42:01
【问题描述】：

我正在制作日历。我希望用户能够单击特定日期（表格单元格）内的任何地方并且发生了一些事情。那天可能有事件，这些事件包含在表格单元格内的 div 中。如果用户单击 div，则会发生其他事情。当用户单击doSomethingElse() 时，我已设法防止事件冒泡，但它在第一次单击时不起作用。它仅适用于后续点击，而不适用于第一次点击。为什么取消事件冒泡在第一次点击时不起作用，而只对所有后续点击起作用？

HTML：

<table>
    <tr>
        <td onclick="doSomething()">
            <div class="view" onclick="doSomethingElse()">Text</div>
        </td>
    </tr>
</table>

Javascript：

function doSomethingElse() {
    $('.view').click(function(e){
        e.cancelBubble = true;
        e.returnValue = false;

        if (e.stopPropagation)
        {
            e.stopPropagation();
        }
    });

    $('#myID').load('myFile.php');
}

更新：我把它放在我的页面上：

<script>
$(document).ready(function() { 
    $('.view').click(function(e){
        e.cancelBubble = true;
        e.returnValue = false;

        if (e.stopPropagation)
        {
            e.stopPropagation();
        }
    });
});
</script>

然后，onclick="doSomethingElse()" 只包含我的脚本的其余部分。问题是doSomethingElse() 有参数，所以看来我还需要以下内容：

<div class="view" onclick="doSomethingElse(id1,id2)">Text</div>

它仍然只适用于第 2 次、第 3 次……点击，而不是第一次。

【问题讨论】：

标签： jquery jquery-events event-bubbling

【解决方案1】：

因为您已经在 onclick 处理程序中有效地编写了绑定代码。将您的点击绑定（$('.view').click 部分）放入您的文档中。还有，为什么负载在handler外面？

【讨论】：

这绝对是对的。用户第一次单击 div 时，会调用 doSomethingElse，它只是绑定一个新的单击处理程序（还不能调用它，因为它当时就被绑定了）。从那时起，任何点击都应该调用 doSomethingElse（它绑定另一个点击处理程序）和该函数中已经绑定的点击处理程序......这是多余且不必要的（但并不完全有害）
感谢 cmets。我不确定“准备好文档中的点击绑定（$('.view').click 部分）”是什么意思。
好的，$(".view").click 只是一个绑定（即将具有该类的元素绑定到 click 事件，而不是实际执行处理程序中的代码）。因此，您希望在用户进行任何点击之前进行绑定。你应该把它放在 "$(document).ready(function() { });"堵塞。删除标记中的显式 onclick="doSomethingElse()"，因为它是多余的。