Question

我有大量像这样对齐的DIV：

+---------------+
| DIV 1         |
+---------------+
| DIV 2         |
+---------------+
| DIV 3         |
+---------------+
| ...           |

我想更改为在用户按住鼠标左键并将鼠标悬停在每个DIV上时切换每个DIV的类。

isMouseDown = false

$('body').mousedown(function () {
    isMouseDown = true;
})
.mouseup(function () {
    isMouseDown = false;
});

$(".div").live("mouseenter", function () {

    if (isMouseDown) {
        $(this).toggleClass("selected");
    }
});

我目前这样做，但只有在用户使用鼠标右键时才能正常工作，因为左键会触发浏览器的默认选择行为。

是否可以使用鼠标左键进行此操作？

编辑：工作代码：

isMouseDown = false

$('body').mousedown(function (e) {
    e.preventDefault(); // Prevent default behavior
    isMouseDown = true;
})
.mouseup(function (e) {
    e.preventDefault(); // Prevent default behavior
    isMouseDown = false;
});

$(".div").live("mouseenter", function (e) {
    e.preventDefault(); // Prevent default behavior
    if (isMouseDown) {
        $(this).toggleClass("selected");
    }
});
// Because IE8 won't get it without this...
$(".div").mousemove(function (e) {
    if ($.browser.msie) {
        e.preventDefault();
        return false;
    }
});

Answer 1

您基本上想要阻止浏览器事件的默认行为。

然后只使用jQuery preventDefault方法。

isMouseDown = false

$('body').mousedown(function (e) {
    e.preventDefault(); // Prevent default behavior
    isMouseDown = true;
})
.mouseup(function (e) {
    e.preventDefault(); // Prevent default behavior
    isMouseDown = false;
});

$(".div").live("mouseenter", function (e) {
    e.preventDefault(); // Prevent default behavior
    if (isMouseDown) {
        $(this).toggleClass("selected");
    }
});

Answer 2

您可以尝试阻止浏览器点击的默认行为。 jQuery disable a link

你能模仿JQuery中的鼠标左键吗？

2 个答案: