JavaScript Cursor Change（并再次变回）

Question

我有这个页面做一些时髦的数据库东西，需要几秒钟来处理，与此同时我想设置一个 "wait" 光标，这样用户就不会惊慌失措并继续点击按钮.我看过

document.body.style.cursor = "wait"

事情，这个问题是它只在鼠标在页面主体上时有效（即，如果它在按钮上，仍然显示正常指针）。我该如何设置它，以便无论鼠标在页面上的哪个位置，它都显示一个等待图标？

这个问题的第二部分是，一旦它完成了，我该如何设置它呢？如果我将它设置回 "default" ，这似乎覆盖了我在 CSS 中设置的任何 "hover" 光标更改（因此当它超过指定对象等时它不再成为一只手).

编辑：第一个答案很好用，除了在 IE 中它不会刷新光标（所以你注意到光标类型的变化）直到你真正移动光标。任何修复？

原文由 Jordan 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

对于您的第一个问题，请尝试使用 cursor: wait !important; 。

对于第二个问题，元素的默认光标是 cursor: auto; ，而不是 cursor: default; 或 cursor: inherit; 。

原文由 Hello71 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

我的建议是两件事：a）最好写一个 CSS

 body.waiting * { cursor: wait; }

b) 使用JS处理body类

/* when you need to wait */
document.body.className = 'waiting';
/* to remove the wait state */
document.body.className = ''; // could be empty or whatever you want

您可能想要添加类而不是替换整个类属性，我建议为此使用类似 jQuery 的东西。

编辑 2019：不要为此使用 jQuery，使用 classList

原文由 Tom Roggero 发布，翻译遵循 CC BY-SA 4.0 许可协议