2012-05-31 31 views
0

我正在使用拖动和滚动在我的页面,它与3个简单的处理程序mousedown,mousemove和mouseup。更改jQuery点击处理函数

现在我有2个问题:

  1. 我所有.on('click'.click(事件样的打破,因为自DIV与鼠标滚动,光标停留在相同的对象和事件触发的。我如何更改处理程序,以便它只在mousedown和mouseup之间的mousemove距离小于固定值时才会触发?它甚至可能或者我必须创建一个并更改所有代码? ---解决---
  2. 我在使用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

解决你应该张贴一些代码 – jbabey

+0

显示美国U2试图代码,只有那么V可以帮助 –

+0

增加的阻力和滚动的3个处理器。 – Nikom

回答

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; 
    } 

}