Question

当我在js中记录click处理程序时，（var clickHandler = button.onclick;）它会按预期提供以下内容：

clickHandler:function () {
    alert("onclick - original onclick handler");
}

然而，当我记录jQuery单击处理程序（var clickHandler = jQuery（＆＃39;＃button＆＃39;）。click;）时，我得到：

  clickHandler:function (a,c){c==null&&(c=a,a=null);return arguments.length>0?this.bind(b,a,c):this.trigger(b)}

为何与众不同？如何处理该功能，以便将其重新分配给另一个事件，例如。 onmousedown事件？

（我需要重新分配一个我无法控制的现有js事件，因此它没有添加jQuery）。

    <input type="text" name="name_input" id="name_input" />
    <a href="#" id="button">Click</a>
    <script>
        var input = document.getElementById("name_input");
        var button = document.getElementById("button");
        input.onchange = function(event) {
            alert("Change");
        };

        //reassign onclick to onmousedown

        button.onclick = function() {
            alert("onclick - original onclick handler");
        };

        //reassign onmousedown handler
        var clickHandler = button.onclick;
        // var clickHandler = jQuery('#button').click;
        console.log('clickHandler:' + clickHandler);

        button.onmousedown = clickHandler;
    </script>

Answer 1

我想你想要这个：

var clickHandler = jQuery('#button')[0].click;

jQuery（[selector]）返回一个数组。

Answer 2

您可以在多个事件上分配相同的点击处理程序：

$('#button').on('click mousedown', function() {
    // do something
});

Answer 3

jQuery('#button').click只是用于设置click事件处理程序的方法，它用作

jQuery('#button').click(event_handler);

但不是

jQuery('#button').click = event_handler;

因此jQuery('#button').click不会向您提供event_handler。

Answer 4

button.onclick是点击处理程序的浏览器本机实现。请参阅this raw HTML example，其中显示了如何在不使用脚本标记的情况下分配单击处理程序。请参阅此链接，了解这是bad idea。

的原因

使用jQuery分配点击处理程序时，您将使用jQuery库将点击处理程序功能分配给按钮。这就是打印jQuery('#button').click时输出不同的原因。

我建议您只使用jQuery，不要混合调用本机JavaScript来操纵事件，例如button.onclick = function(){};。见here

如何使用jQuery重新分配Javascript事件？

4 个答案: