jQuery:ajax 事件

Question

好的，这是我的代码

$("#content_Div").ajaxStart(function () {
    $(this).css('cursor', 'wait')
}).ajaxComplete(function () {
    $(this).css('cursor', 'default')
});

这是一个相当简单的问题:在 ajaxStart 上，光标立即变为(等待)沙漏，但在 ajaxComplete 上，它不会变回默认值，直到您移动鼠标。

大声笑那是我的问题，但是当我写这篇文章时我意识到如果你点击 ajaxComplete 之后它会变回默认值，所以光标在 ajaxStart 上立即改变的唯一原因是你必须双击 content_Div 中的一个元素为了启动请求，所以单击事件是在 ajaxStart 事件开始后更改光标。所以我想要的是一种无需移动或再次单击即可更改为光标的方法。

显然我想在请求完成时使用光标通知用户。

提前致谢

对于托马斯:

function DF() { //Deletes selected File
if (selectedfiles.length == 0) {
    alert("No file slected!");
    return
};
var selectedtxt = (selectedfiles.length == 1) ? "'" + basename(selectedfiles[0]) + "'?" : 'these ' + selectedfiles.length + ' files?';
if (confirm("Are you sure you want to delete " + selectedtxt)) {
    $.each(selectedfiles, function () {
        $.post("server/editfile.php", {
            user: user,
            oper: "del",
            path: "../" + this
        }, function (res) {
            if (res) {
                alert(res);
            }
            else LT(dirHistory[current]);
        });
    })
}

Answer 1

确实看起来用户必须在光标发生变化之前移动光标，但除此之外，还有另一个问题。如果用户将光标从 #content_Div 移开，那么他们将看不到数据是否正在加载，因为 CSS 仅在将鼠标悬停在该特定 DIV 上时应用。

无论用户做什么，都可以清楚地表明正在获取数据的方法是使用动画 gif、“正在加载...”字样，或同时使用这两种方法。此解决方案也比更改用户光标的侵入性小一些。

如果在请求数据时，将加载图像附加到将显示数据的 div 中，那么加载图像将在数据加载后自然消失。例如:

$("#content_Div").ajaxStart(function () {
    $("#content_Div").append('<img src="loading.gif" />');
});

在这种情况下不需要 ajaxStop，因为加载的数据会替换图像。

Here is a jsFiddle example that makes use of both an image and lettering.

jsFiddle with multiple buttons and a loading div at the center of the page.