我使用此jQuery代码在Ajax调用期间将鼠标指针设置为其繁忙状态（沙漏）。

$('body').css('cursor', 'wait');

并使用相应的代码将其设置为正常...

$('body').css('cursor', 'auto');

在某些浏览器上工作正常。

在Firefox和IE上，只要执行命令，鼠标光标就会改变。这是我想要的行为。

在Chrome和Safari上，除非用户移动指针，否则鼠标光标不会从“忙”变为“自动”。

使勉强的浏览器切换鼠标指针的最佳方法是什么？

目前，这两种浏览器均存在错误。两个链接上的更多详细信息（以及评论）：

http://code.google.com/p/chromium/issues/detail?id=26723

和

http://code.google.com/p/chromium/issues/detail?id=20717

我宁愿这样优雅地做：

$(function(){  
  $("html").bind("ajaxStart", function(){  
     $(this).addClass('busy');  
   }).bind("ajaxStop", function(){  
     $(this).removeClass('busy');  
   });  
});

CSS：

html.busy, html.busy * {  
  cursor: wait !important;  
}  

资料来源：http : //postpostmodern.com/instructional/global-ajax-cursor-change/

我认为此问题（包括mousedown问题）现在已在Chrome 50中修复。

但前提是您不使用开发人员工具！

关闭工具，光标应立即响应。

我从Korayem解决方案中得到启发。

Javascript：

jQuery.ajaxSetup({
    beforeSend: function() {
       $('body').addClass('busy');
    },
    complete: function() {
       $('body').removeClass('busy');
    }
});

CSS：

.busy * {
    cursor: wait !important;
}

在Chrome，Firefox和IE 10上进行了测试。无需移动鼠标即可更改光标。IE10需要“！important”。

编辑：AJAX请求完成后，您仍然必须在IE 10上移动光标（因此，出现普通光标）。等待光标出现而无需移动鼠标。

首先，您应该意识到，如果您将光标分配给体内的任何标签，$('body').css('cursor', 'wait');都不会更改该标签的光标（像我一样，我cursor: pointer;在所有锚标签上使用）。您可能想先看看我对这个特定问题的解决方案：光标等待ajax调用

正如其他人所说，对于仅在用户在Webkit浏览器上移动鼠标后才更新光标的问题，没有真正的解决方案。

话虽如此，如果您将css微调器动态地添加到当前光标，仍然存在解决方法。这不是一个完美的解决方案，因为您不确定光标的大小以及旋转器是否正确定位。

光标后的CSS微调器：DEMO

$.fn.extend(
{
    reset_on : function(event_name, callback)
    { return this.off(event_name).on(event_name, callback); }
});

var g_loader = $('.loader');

function add_cursor_progress(evt)
{
    function refresh_pos(e_)
    {
        g_loader.css({
            display : "inline",
            left : e_.pageX + 8,
            top : e_.pageY - 8
        });
    }
    refresh_pos(evt);
    var id = ".addcursorprog"; // to avoid duplicate events

    $('html').reset_on('mousemove' + id, refresh_pos);

    $(window).
    reset_on('mouseenter' + id, function(){ g_loader.css('display', 'inline'); }).
    reset_on('mouseleave' + id, function(){ g_loader.css('display', 'none'); });
}

function remove_cursor_progress(evt)
{
    var id = ".addcursorprog";
    g_loader.css('display', 'none');

    $('html').off('mousemove' + id);
    $(window).off('mouseenter' + id).off('mouseleave' + id);
}

$('.action').click(add_cursor_progress);
$('.stop').click(remove_cursor_progress);

您还需要检查它是否也是触摸设备 var isTouchDevice = typeof window.ontouchstart !== 'undefined';

总之，您最好尝试在页面中添加静态微调器或其他可以显示加载过程的控件，而不要尝试使用游标进行操作。

Korayem的解决方案在现代Chrome，Safari中100％的情况下对我有效，在Firefox中95％的情况下对我有效，但在Opera和IE中不起作用。

我做了一些改进：

$('html').bind('ajaxStart', function() {
    $(this).removeClass('notbusy').addClass('busy');
}).bind('ajaxStop', function() {
    $(this).removeClass('busy').addClass('notbusy');
});

CSS：

html.busy, html.busy * {
    cursor: wait !important;
}

html.notbusy, html.notbusy * {
    cursor: default !important;
}

现在，它可以在Chrome，Safari，Firefox和Opera中100％使用。我不知道该如何处理IE :(

CodeSandbox上的工作解决方案

其他一些解决方案并非在所有情况下都有效。我们可以使用两个CSS规则来达到预期的结果：

body.busy, .busy * {
  cursor: wait !important;
}

.not-busy {
  cursor: auto;
}

前者表示我们很忙，并应用于页面上的所有元素，试图覆盖其他光标样式。后者仅适用于页面正文，仅用于强制UI更新。我们希望此规则尽可能不具体，并且不需要将其应用于其他页面元素。

然后我们可以触发并结束繁忙状态，如下所示：

function onBusyStart() {
    document.body.classList.add('busy');
    document.body.classList.remove('not-busy');
}

function onBusyEnd() {
    document.body.classList.remove('busy');
    document.body.classList.add('not-busy');
}

总而言之，尽管我们必须更改游标样式以更新游标document.body.style.cursor，但是在某些组件（例如Webkit）上，直接移动或直接修改游标并不会产生预期的效果，直到游标被移动为止。使用类来影响更改更加健壮。但是，为了可靠地强制UI更新（再次在某些引擎上），我们必须添加另一个类。删除类似乎与添加类不同。

我认为您将无法做到。

但是，尝试更改滚动位置。它可能会有所帮助。

这里是我的解决方案：

function yourFunc(){

$('body').removeClass('wait'); // this is my wait class on body you can $('body').css('cursor','auto');
$('body').blur();
$('body').focus(function(e){
$('body')
 .mouseXPos(e.pageX + 1)
 .mouseYPos(e.pageX - 1);
});

}

从jquery 1.9开始，您应该使用ajaxStart和ajaxStop来记录文档。他们对我来说很好用Firefox。尚未在其他浏览器中进行过测试。

在CSS中：

html.busy *
{
   cursor: wait !important;
}

在javaScript中：

// Makes the mousecursor show busy during ajax 
// 
$( document )

   .ajaxStart( function startBusy() { $( 'html' ).addClass   ( 'busy' ) } )     
   .ajaxStop ( function stopBusy () { $( 'html' ).removeClass( 'busy' ) } )

尝试为游标属性使用正确的css值：

$('body').css('cursor','wait');

http://www.w3schools.com/CSS/pr_class_cursor.asp

这可能是WebKit中的错误。你应该报告。

我还没有尝试过，但是如果您创建一个绝对定位并在更改CSS之前填充视口的透明div呢？然后，在主体上更改CSS时，删除div。这可能会触发身体上的鼠标悬停事件，这可能导致光标更新为最新的CSS值。

同样，我还没有测试过，但是值得一试。

嗨，大家好，我有一个不错的解决方案，适用于所有浏览器。假设是使用原型库。有人也可以将其编写为纯Javascript。解决方案是，在重置光标并将其稍微摇晃一下以使光标移动之后，首先在所有div上放一个div。这已发布在我的博客http://arunmobc.blogspot.com/2011/02/cursor-not-changing-issue.html中。

$（'*'）。css（'cursor'，'wait'）; 可以在页面上的任何地方使用，包括链接