javascript - 关于jquery trigger和click事件的问题

问题描述

问 题

HTML代码

<a id="link">链接</a>
<p id="text">文本</p>

js代码

<script type="text/javascript">
    var objText = $("#text");
    objText[0].onclick = function() {
        console.log("onclick");
    };
    objText.click(function() {
        console.log("click");
    });
    $("#link").click(function() {
        objText.trigger("click");
    });
</script>

按顺序依次执行：

1. 点击text，输出 onclick click

2. 点击link，输出 click onclick

3. 再点击text，输出 click onclick

问题：

• 为什么2)的事件顺序跟1）不一样？

• 为什么执行了2）后，再点击text，事件顺序跟1）中的不一样？

注：使用的jquery版本是1.11.0

解决方案

1.第一个的情况只是因为你绑定事件的前后顺序，如果前后换位，则输出结果会变为click, onclick
2.jq的trigger作用为触发一个事件，使其被对应的事件监听所响应。内部代码对原生的事件和jq的事件做了区别处理，具体情况即为在不禁止原生事件情况下，先处理jq事件，再处理原生事件。最终结果为点击#link时的输出为click,onclick;
3.至于为什么使用trigger之后的输出顺序与第二种情况下一致，是因为trigger在处理时候重新绑定事件，先jq事件，后原生事件的顺序。

这篇关于javascript - 关于jquery trigger和click事件的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！