当前位置: 代码迷 >> JavaScript >> 如何防止jQuery可调整大小的div接收调整大小的click事件
  详细解决方案

如何防止jQuery可调整大小的div接收调整大小的click事件

热度:26   发布时间:2023-06-12 14:37:57.0

我创建一个div,然后:

$("#div").resizable({
    disabled:true
});

然后,我启用调整大小行为,同时我想处理对div的单击:

$("#div").on("click", myHandler);
$("#div").resizable( "option", "disabled", false);

function myHandler() {
    console.log("div clicked");
}

如果现在我拖动div的右下角,则可以调整其大小,但是当鼠标指针位于div内时(当缩小时会发生这种情况),当释放拖动时,也会调用myHandler() 由于myHandler()应该处理不同的行为-而不是调整大小-我该如何解决呢?

到目前为止我没有尝试过的尝试:

$("#div").resizable({
    disabled:true,
    stop: function(event) { event.stopPropagation(); }
});

仅当鼠标位置与开始位置相同时,才执行单击处理程序?

var left = 0;
var top = 0; 

("#div").on({
        mousedown: function(e) {
            left  = e.pageX;
            top   = e.pageY;
        },
        mouseup: function(e) {
            if (left === e.pageX && top === e.pageY) {
                console.log('click');
            }
        }
});
  相关解决方案