`mousemove`和触发自定义事件
问题描述:
在mousemove
事件:`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);
});
有没有办法在myevent
访问这些pageX
和pageY
?
答
.trigger()
允许通过其参数传递附加数据。您可以拨打
$(document).on('mousemove', function(event){
$(document).trigger('myevent', event);
});
现在您可以访问自定义事件代码中的整个原始event
对象。
答
创建自定义事件
另一种选择是像
$(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>