Question

当用户点击对话框时，我需要防止隐藏模态对话框，然后将鼠标移到对话框之外，然后释放它。该对话框放置在注册click事件的外部div中。 Here是模态对话框及其设置的示例。

所以我做了以下事情：

var pointerDownElement = null;

$('.d1').on('mousedown', function(event) {
    // this is how I do it to prevent triggering of click event
    pointerDownElement = event.target;

    // this is how a browser does it
    pointerDownElement = event.currentTarget;
});

$('.d1').on('mouseup', function(event) {
    var element = event.target;
    if (element === pointerDownElement) {
        console.log('triggering click');
    }
});

这种做法是否正确？

Answer 1

你肯定是在正确的轨道上。稍微修改过的代码：

var pointerDownElement = null;

$('.d1').on('mousedown', function(event) {
    event.preventDefault();
    pointerDownElement = event.currentTarget;
    return false;
});

$('.d1').on('mouseup', function(event) {
    if (event.target=== pointerDownElement) {
        console.log('triggering click');
    }
});

如果您只使用一次，则无需为变量赋值。另外，event.preventDefault（）;并返回false;将保证事件的默认行为不会发生（不是通常有一个mousedown，但我假设您有理由包含此代码）。

如果释放鼠标时内部元素没有悬停，则可以正确防止触发“click”

1 个答案: