将鼠标图标更改为“等待”，无论它在哪里

Question

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

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

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

Answer 1

您可以使用 !important 覆盖按钮、链接、输入和正文上的 css 集。

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

注意上面cssText的用法。

您也可以指定 * 作为您的选择器，但这太鲁莽了。

Answer 2

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

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

---

在您的 CSS 中，您可以定义加载光标以在任何地方显示。

.loading * {
  cursor: wait !important;
}