javascript - 在 Opera 中使用 jquery 为元素分配动态光标样式

Question

我试图在鼠标悬停在元素上时动态更改光标样式。光标应该是“移动”或“默认”，具体取决于方法返回的 bool 值。代码是这样的:

$("#elemId").mousemove(function(event) {
    if(cursorShouldBeMove()) {
        $(this).css({'cursor':'move'});
    } else {
        $(this).css({'cursor':'default'});
    }
}

此代码在 IE8、FF3、Chrome 和 Safari 中的效果非常好。只有 Opera 无法正确处理它。

我正在使用 Opera 9.6.4

有没有人知道如何解决这个问题？

---

我准备了一个 sample 进行测试；

var cursorStatus = true;
setInterval(function() { cursorStatus = !cursorStatus; }, 500);

function cursorShouldBeMove() {
  return cursorStatus;
}

$(function() {
  $("#elemId").mousemove(
    function(event) {
      $(this).css("cursor", cursorShouldBeMove() ? "move" : "default");
    }
  );
});

如果您将鼠标从#elemId 外部移到其中几次，您会看到光标会发生变化。但是，如果您将鼠标放在 #elemId 中并移动鼠标，则光标不会改变。

代码非常简单。我认为这是 Opera 的一个错误。

我也测试了这段代码；

• Firefox 3.5.1(可用)
• Internet Explorer 7(可用)
• 谷歌浏览器 2.0(可用)
• Safari 3.2(可用)

(Windows 版本)

Answer 1

Opera 的光标真的很有趣。我发现您必须将鼠标移到该元素上两次才能真正起作用。可以看到here您需要将鼠标悬停在 Hello World 上两次才能使光标发生变化。

描述了相同的问题 here