将鼠标图标更改为 'waiting' 无论它在哪里

Question

我正在开发一个提取和更新客户信息的 Web 表单，它有多个 ajax 请求，这些请求有点慢（2-4 秒）。每当页面等待结果时，我都添加了一个 'waiting' 光标。然而，很多时候页面都在等待请求，用户要么将光标留在按钮上，要么将光标留在 table 上（通过制表符），因此光标停留在 hand/click 光标和加载轮上不可见。如果用户将鼠标从 button/table 移开，它会变为加载轮。我已经在使用 jQuery 进行 ajax 调用，所以我正在使用这段代码：

$(document.body).css({'cursor' : 'wait'});

有没有办法可以强制图标加载到加载轮，无论它处于什么状态？

Answer 1

您可以使用 !important 覆盖在按钮、链接、输入和主体上设置的 css。

$("body,a,button,input").css("cssText", "cursor:wait !important;");

注意上面css文本的用法。

您也可以将 * 指定为您的选择器，但那样做会很鲁莽。

Answer 2

我建议您在正文中添加 class，而不是将 cursor: wait; 添加到页面上的多个元素。

$(document.body).addClass('loading');

---

在您的 CSS 中，您可以定义加载光标以随处显示。

.loading * {
  cursor: wait !important;
}