`mousemove`并触发自定义事件

Question

在mousemove事件中：

$(document).on('mousemove', function( e ){
    console.log( e.pageX );
    console.log( e.pageY );
});

如您所见，我们可以使用pageX和pageY来获取鼠标位置的x和y坐标。 但是，我想要的是在mousemove上触发我的自定义事件，并希望在我的该自定义事件中获取这些pageX和pageY值。 更清楚地说，我想做的是：

$(document).on('mousemove', function(){
    $(document).trigger('myevent');
});

$(document).on('myevent', function( e ){
    // console.log( e.pageX );
    // console.log( e.pageY );
});

有没有什么办法来访问这些pageX和pageY在myevent ？

Answer 1

.trigger()允许通过其参数传递其他数据。 你可以打电话

$(document).on('mousemove', function( event ){
    $(document).trigger('myevent', event);
});

现在，您可以在自定义事件代码中访问整个原始event对象。

Answer 2

另一种选择是创建一个自定义事件，例如

 $(document).on('mousemove', function(e) { var event = $.Event('myevent', { pageX: e.pageX, pageY: e.pageY }); $(document).trigger(event); }); $(document).on('myevent', function(e) { log(e.pageX + ':' + e.pageY) }); var log = function(message) { var $log = $('#log'); $log.html(message) }; 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="log"></div>