JQUERY如何在拖动时禁用不允许的光标? [英] JQUERY How to disable not-allowed cursor while dragging?

问题描述

我在不允许的光标上遇到了问题.拖动拖动"元素时，出现不允许的光标，我不能再拖动它.我该如何预防呢?我希望在鼠标按下时使拖动"元素始终为绝对".

I've got issue with the not-allowed cursor. While dragging the "drag" element, not-allowed cursor appears and I can't drag it anymore. How can i prevent that? I want to make my "drag" element always be "absolute" while mouse is down.

注意:我知道它可能是由于指针事件"而发生的，但是我需要将其包含在此代码中.

Note: I know that it can happens becouse "pointer-events" but I need it to be contained into this code.

一些代码:

$("#drag").bind({
  mousedown : function (e) {
      var dragged = $(this);
      dragged.css({
          left : e.pageX - (50 / 2),
          top : e.pageY - (50 / 2)
      });
      dragged.addClass("absolute");
      dragged.css({
          'pointer-events' : 'none'
      })
      var upHandler = function () {
          dragged.removeClass("absolute");
          dragged.css({
              'pointer-events' : 'all'
          })
          $("body").off('mouseup', upHandler);
          $("body").off('mousemove', moveHandler);
      }
      var moveHandler = function (e) {
          dragged.css({
              left : e.pageX - (50 / 2),
              top : e.pageY - (50 / 2)
          });
      }

      $("body").bind({
          mouseup : upHandler,
          mousemove : moveHandler
      })
  }
  });

  $("body").mousemove(function (event) {
     $("#log").text("pageX: " + event.pageX + ", pageY: " + event.pageY);
  });

https://jsfiddle.net/38zecoL1/1/

感谢您的帮助.

推荐答案

在处理鼠标事件之前，请致电

Before handling your mouse events, make a call to

e.preventDefault();

它取消了阻止浏览器执行默认行为的事件.通常，它会在通常不可拖动的元素上显示不允许"光标.

It cancels the event which prevents the browser from performing the default behavior. Normally it would show a "not allowed" cursor on elements that typically are not draggable.

您可以看到它的运行情况: https://jsfiddle.net/38zecoL1/4/

You can see this in action: https://jsfiddle.net/38zecoL1/4/

这篇关于JQUERY如何在拖动时禁用不允许的光标?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！