jquery – 在单击保持和拖动期间,偏移不会更新mousedown事件

这是一个示例小提琴你点击红色框,它显示指针相对于框的坐标.

如果单击并拖动,我如何修改此脚本以允许更新坐标？当我按住单击并移动鼠标时,允许坐标更新.

http://jsfiddle.net/lonesomeday/5qxtL/2/

来自小提琴的代码：

$('#target').mousedown(function(e) {
    var offset = $(this).offset(),imgLeft = e.pageX - offset.left,imgTop = e.pageY - offset.top;

    $('#result').text('Mouse clicked x = ' + imgLeft + ' Y = ' + imgTop);
});

我尝试了一些不同的东西,但到目前为止还没有任何工作,除了没有答案的问题之外,找不到另外一个类似的问题.

谢谢

最佳答案

只需在鼠标按下时设置一个标志,然后在鼠标移动时检查它.你的拖累：

var mouseDownFlag = false;
$('#target').mousedown(function(e) {
  mouseDownFlag = true;
  var offset = $(this).offset(),imgTop = e.pageY - offset.top;

  $('#result').text('Mouse clicked x = ' + imgLeft + ' Y = ' + imgTop);
});
$('#target').mouseup(function(e) {
  mouseDownFlag = false;
});
$('#target').mousemove(function(e) {
  if (mouseDownFlag) {
    var offset = $(this).offset(),imgTop = e.pageY - offset.top;
    $('#result').text('Mouse clicked x = ' + imgLeft + ' Y = ' + imgTop);
  }
});

div {
  width: 200px;
  height: 100px;
  position: relative;
  left: 30px;
  top: 15px;
  background-color: #f00;
}
#result {
  background-color: #fff;
}

                                
原文地址：https://www.jb51.cc/jquery/428329.html
                                 
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。
                            

• 上一篇：javascript – 使用jQuery / JS向下一篇：jquery – Slick.js显示当前幻灯