javascript - Jquery 拖动会在 mousemove 上触发,但不会在 mousedown 上触发

标签 javascript jquery jquery-ui jquery-ui-draggable

所以我正在使用 Jquery-ui 的“draggable”,并注意到一些事情;拖动事件仅在鼠标移动时触发。现在,对于我正在构建的应用程序,我需要它在鼠标按下和鼠标移动时触发。为了证明我的意思,请查看 this来自 Jquery-ui 网站的示例。这些元素会捕捉到相对于鼠标的某个位置 - 但仅当您移动鼠标时。我知道这不是默认行为,但我需要模拟它。让我在这里解释一下我的情况;

我有一个盒子,里面有一个圆圈。用户可以拖动框周围的圆圈,但当用户将鼠标放在框中的其他位置时,圆圈会捕捉到光标。现在,我有这个:

    $('#big-box').mousedown(function(event){
        $('#tiny-circle').trigger(event);
    });

这可以确保当用户按下鼠标并将鼠标移动到框中的其他位置时触发拖动事件,但是当用户单击框中的某个位置而不是圆圈上时,我需要该圆圈捕捉到光标。我该如何以干净的方式做到这一点?为了说明我的意思; Google's colorpicker准确地表达了我的观点。您四处拖动圆圈,但当用户仅单击时,圆圈就会捕捉到光标。

最佳答案

好吧,经过一些实验,我认为这已经是我可以得到问题的干净解决方案的最接近了:

    $('#big-box').mousedown(function(event){
        $('#tiny-circle').css({left:event.offsetX,top:event.offsetY});
        $('#tiny-circle').trigger(event);
    });

这按预期工作。

关于javascript - Jquery 拖动会在 mousemove 上触发,但不会在 mousedown 上触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42608541/

相关文章:

javascript - 如何在提交表单之前删除 AutoNumeric 格式?

javascript - 在 jQuery 中搜索许多 div 的属性

asp.net - RequiredFieldValidator 不能与 jQuery UI 一起正常工作

javascript - JQuery UI 将多组单选按钮转换为 slider

javascript - 使拖放的元素可放置,同时仍可拖动

javascript - Angular,用 settimeout 模拟 promise ($q)

javascript - 拒绝在 jQuery ajax 中延迟

javascript - 如何以功能方式实现数组连接?

javascript - jQuery scrollTop 有问题

javascript - 如何通过表单上传文件后清除输入字段