我在我的页面中使用拖动和滚动,它正在使用3个简单的处理程序mousedown,mousemove和mouseup。
现在我有2个问题:
.on('click'
和.click(
事件都被破坏了,因为div正在用鼠标滚动,所以光标停留在同一个对象上并且事件会触发。我如何更改处理程序,以便只有当mousedown和mouseup之间的mousemove的距离小于固定值时才会触发?它甚至可能还是我必须创建一个自己的并更改所有代码? --- ---解决event.preventDefault();
来阻止选择。这导致用户无法单击表单字段。有没有一种简单的方法来解决这个问题,还是我必须以另一种方式停止选择? ---解决了办法--- 任何想法都会有所帮助。
这是滚动的3个处理程序:
mouseDownHandler : function(event) {
if (!$(event.target).closest('.stopscroll').length) {
event.data.lastCoord = {left: event.clientX, top: event.clientY};
$.event.add( document, "mouseup", dragscroll.mouseUpHandler, event.data );
$.event.add( document, "mousemove", dragscroll.mouseMoveHandler, event.data );
$('body').addClass('dragcursor'); //// Add Move Cursor
if (!$(event.target).closest('.noformelement').length) {
event.preventDefault();
return false;
}
}
},
mouseMoveHandler : function(event) {
var delta = {left: (event.clientX - event.data.lastCoord.left), top: (event.clientY - event.data.lastCoord.top)};
event.data.scrollable.scrollLeft(event.data.scrollable.scrollLeft() - delta.left);
$('.th-header').css('margin-left', -event.data.scrollable.scrollLeft()); //// Scrollsync with header
event.data.scrollable.scrollTop(event.data.scrollable.scrollTop() - delta.top);
event.data.lastCoord={left: event.clientX, top: event.clientY}
if (!$(event.target).closest('.noformelement').length) {
event.preventDefault();
return false;
}
},
mouseUpHandler : function(event) {
$.event.remove( document, "mousemove", dragscroll.mouseMoveHandler);
$.event.remove( document, "mouseup", dragscroll.mouseUpHandler);
$('body').removeClass('dragcursor');
if (!$(event.target).closest('.noformelement').length) {
event.preventDefault();
return false;
}
}
更新/凹凸:只是立刻禁用每个点击事件我已经解决了这个问题。我试过$(document).on('click', '*', function() {return false;});
,但它不起作用......
答案 0 :(得分:0)
解决了
mouseDownHandler : function(event) {
if (!$(event.target).closest('.stopscroll').length) {
event.data.lastCoord = {left: event.clientX, top: event.clientY};
event.data.startCoord = {left: event.clientX, top: event.clientY};
event.data.allowClick = true;
$('*').off('click.stop');
$.event.add( document, "mouseup", dragscroll.mouseUpHandler, event.data );
$.event.add( document, "mousemove", dragscroll.mouseMoveHandler, event.data );
if (!$(event.target).closest('.noformelement').length) {
event.preventDefault();
return false;
}
}
},
mouseMoveHandler : function(event) {
var delta = {left: (event.clientX - event.data.lastCoord.left), top: (event.clientY - event.data.lastCoord.top)};
var range = {left: (event.clientX - event.data.startCoord.left), top: (event.clientY - event.data.startCoord.top)};
if (event.data.allowClick && (Math.abs(range.left)>=5 || Math.abs(range.top)>=5)) {
event.data.allowClick = false;
$('*').on('click.stop', function() {return false;});
$('body').addClass('dragcursor'); //// Add Move Cursor
}
event.data.scrollable.scrollLeft(event.data.scrollable.scrollLeft() - delta.left);
$('.th-header').css('margin-left', -event.data.scrollable.scrollLeft()); //// Scrollsync with header
event.data.scrollable.scrollTop(event.data.scrollable.scrollTop() - delta.top);
event.data.lastCoord={left: event.clientX, top: event.clientY}
if (!$(event.target).closest('.noformelement').length) {
event.preventDefault();
return false;
}
}