8

我了解如何在页面进行和 ajax 调用时使用 javascript 将光标更改为忙。

但是我有一个不使用 ajax 的页面，它使用回发来重新加载页面。然而，负载是相当数据密集型的，需要几秒钟。在此期间，用户仍然可以点击页面。我想将光标转到“等待”，这样用户就不会尝试点击页面。

例如，我有几个下拉菜单会导致回发。我做了一个选择，页面加载了 3 秒。在加载时，我希望光标转向等待，以便用户在页面重新加载之前不会尝试在第二个下拉列表中进行选择。

这可能吗？

附加信息：（我的设置的简化版本）

我有一个母版页：

<form id="form1" runat="server">
<table width = "100%" bgcolor="White">
<tr><td>
<h3><asp:ContentPlaceHolder id="MAIN" runat="server"></asp:ContentPlaceHolder></h3>
</tr></td>
</table>
</form>
<script type="text/javascript">
    function cursorwait(e) {
        document.body.style.cursor = 'wait';
    }

    var fm = document.getElementById('<% =form1.ClientID %>');
    if (fm.addEventListener) {
        fm.addEventListener('submit', cursorwait, false);
    }
    else {
        fm.attachEvent('onsubmit', cursorwait);
    }
</script>

然后是使用母版页的页面：

<asp:Content ID="Content1" ContentPlaceHolderID="MAIN" Runat="Server">
<table runat=server id="tb_simple_search_table" cellpadding = 0 cellspacing = 0>
<tr><td>
    <asp:DropDownList...
    <asp:DropDownList...
</td></tr>
</table>
</asp:content>
4

3 回答 3

6

我不确定这是否是最好或最有效的方法，但如果您想在按钮单击以下 jQuery 后更改光标以显示页面繁忙，应该可以解决问题：

$(document).ready(function() {
    $(".button").click(function() {
        $("*").css("cursor", "wait");
    });
});
于 2010-10-29T16:14:29.110 回答
5

您可以将处理程序添加到表单的submit事件中。

CSS

    .wait, .wait * { cursor: wait; }

JavaScript

function cursorwait(e) {
    document.body.className = 'wait';
}

var fm = document.getElementById('<% =form1.ClientID %>');
var proxySubmit = fm.onsubmit;

fm.onsubmit = function () {
    cursorwait();
    if (proxySubmit) {
        proxySubmit.call(fm);
    }
}

在这里，我们确保如果submit()在 js 中调用我们的方法，就像下拉菜单在导致回发时一样。这也应该捕获表单提交的任何其他实例。

于 2010-10-29T16:17:00.810 回答
1

给每个按钮一个类，说“WaitOnClick”，然后写：$(".WaitOnClick").click(function() {

于 2014-09-17T08:09:30.437 回答