为什么事件对象不同于jquery bind和addEventListener [英] Why is the event object different coming from jquery bind vs. addEventListener

问题描述

为什么我使用jQuery绑定我收到的事件对象与事件对象不同于我使用addEventListener返回？

Why is it when I use the jQuery bind the event object I get back is different from the event object I get back using addEventListener?

由这个jQuery绑定没有targetTouches数组（除其他外），但是来自addEventListener的事件。这是我还是不正确的？

The event object resulting from this jQuery bind does not have the targetTouches array (among other things) but the event from the addEventListener does. Is it me or is something not right here?

$(document).ready (function () {
    $("#test").bind("touchmove", function (event) {
        console.log(event.targetTouches[0].pageX);
        // targetTouches is undefined
    });
});

vs。

$(document).ready (function () {
    var foo = document.querySelectorAll('#test')
    foo[0].addEventListener('touchmove', function (event) {
        console.log(event.targetTouches[0].pageX);
        // returns the correct values
    }, false);
});

推荐答案

这是因为jQuery使用自己的事件模型。

That's because jQuery uses its own Event model.

jQuery只是复制并将原始事件中的某些属性归一化为您作为处理程序的第一个参数获取的事件对象。

jQuery simply copies and normalizes some properties from the original event, to the event object that you get as the first argument of the handler.

复制的属性为基于 DOM级别3事件规范。

要获取原始的事件对象，您可以：

To get the original event object, you can:

$(document).ready (function () {
    $("#test").bind("touchmove", function (event) {
        var e = event.originalEvent;
        console.log(e.targetTouches[0].pageX);
    });
});

可以访问 originalEvent 属性，工作，但没有记录，您可以在 jQuery.Event 构造函数。

The originalEvent property is accessible and it will work, but is not documented, you can see how it's set behind the scenes in the jQuery.Event constructor.

这篇关于为什么事件对象不同于jquery bind和addEventListener的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！