1

假设我有一个.gif

<img alt="" src="./wait.gif" />

我有一个标签:

<asp:Label ID="tbnotif" runat="server" ReadOnly="True" Text="" ></asp:Label>

还有一个按钮:

<asp:Button ID="Button1" runat="server" Text="Pubblica" OnClientClick="show_table();add_gif();" OnCommand="Button1_Click" />

我正在使用aspx页面,问题是:

我可以单击按钮并同时.gif使用 JavaScript 显示并从后面的代码中更改标签吗?或者事情永远不会同时显示?

4

1 回答 1

0

在我看来,您想在回发之间显示一个忙碌的动画 gif,对吗?

这是我的做法(除非我使用具有自己的进度指示器服务器控件的更新面板)

<script type="text/javascript">
    window.onbeforeunload = function(){showGif();};
</script>

当页面因为回发而卸载时(单击 POST 到服务器的按钮),显示 gif 图像。当新页面从服务器返回时,图像将消失,因为它现在是一个新页面。

更改标签是一个小操作,因此您可能永远看不到图像,因为请求/响应会很快转过来。为了进行测试,您可以在按钮处理程序中添加 System.Threading.Thread.Sleep(3000) 以模拟更长的运行过程。

编辑

AJAX 是你唯一的选择,但有很多方法。一种可能的解决方案:

将标签放在 UpdatePanel 服务器控件中,将按钮放在更新面板之外,但在更新面板的 aspx 页面中的声明性标记中将其设置为 AsyncPostbackTrigger。使用 OnClientClick 处理程序客户端或使用 JQuery 将客户端单击处理程序附加到按钮显示 gif。

aspx

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="AjaxLabel._Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager runat="server" ID="ScriptManager1"></asp:ScriptManager>
    <div>
        <asp:UpdatePanel runat="server">
            <ContentTemplate>
                <asp:Label runat="server" ID="ajaxLabel">Initial value</asp:Label>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="asyncButton" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>

        <img id="theImage" src="img/success.png" style="display: none;" />

        <asp:Button runat="server" ID="asyncButton" Text="Client & Server Click" OnClientClick="showImage();" OnClick="asyncButton_Click" />

    </div>
    </form>

    <script type="text/javascript">

        function showImage() {

            document.getElementById('theImage').style.display = "block";
        }

    </script>

</body>
</html>

aspx.cs

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AjaxLabel
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void asyncButton_Click(object sender, EventArgs e)
        {
            ajaxLabel.Text = "Server-side value";
        }
    }
}
于 2013-02-12T13:19:15.263 回答