Javascript 确认对话框 - ASP.NET答案

【问题标题】：Javascript confirmation dialog - ASP.NETJavascript 确认对话框 - ASP.NET
【发布时间】：2009-02-07 22:47:11
【问题描述】：

我看到了几个关于同一主题的类似问题，但没有一个解决了我的问题。

我有一个 asp.net 网站，想在数据库更新后向用户显示一条状态消息（asp:label 将在 5 秒内消失）。

我想将文本分配给标签，然后用 Javascript 隐藏它。

js部分整理好了，唯一的问题是给控件赋值后如何调用js函数？

假设我正在使用以下代码更新数据库中的某些内容：

<asp:Button ID="btnUploadFiles" runat="server" OnClick="buttonSubmit_Click" Text="Update"  />

后面的代码

protected void buttonSubmit_Click(object sender, EventArgs e)
    { try{// update the database  
          // change label text to tell the user update succeeded}
      catch(Exception ex){...}
    }

请帮忙！

更新：请不要使用 jquery，只需使用普通的 javascript

【问题讨论】：

此处列出的非 jquery 解决方案最终可能会失败，因为当您隐藏元素时未加载 DOM。即使您还不知道框架，您也最好使用它。
如果你不想使用框架或编写等效代码，你至少应该将脚本放在页面底部（而不是页眉），以便它运行完的 HTML 已被解析。在这种情况下，这可能会可靠地工作，但不适用于所有类型的操作。

标签： javascript c# asp.net .net-2.0 dom-events

【解决方案1】：

我个人会为此使用 jQuery，但如果你想使用普通的旧 JavaScript，那么这样的东西可能会解决问题：

<script type="text/javascript">
function hideLabel()
{
    // replace yourLabelID with <%=YourLabelID.ClientID%> if it's a .NET Label control
    document.getElementById('yourLabelID').style.display = 'none';
}
setTimeout('hideLabel()', 5000);
</script>

如有必要，您还可以将脚本块嵌入到 Literal 控件中，并且仅在更新标签文本时使其可见。

【讨论】：

您不需要将 'hideLabel()' 作为字符串传递。您可以改为传递 setTimeout 对函数的引用：“setTimeout(hideLabel, 5000);”。在这种情况下并没有太大的区别，因为它是一个带有常量的一次性调用，但最好避免执行字符串。
@Matthew，你说得对。我当时脑子里正在写这个例子，不确定非字符串版本是否有任何潜在的浏览器兼容性问题，所以我认为最好谨慎一点。

【解决方案2】：

回答您的问题“我将文本分配给控件后如何调用 js 函数？”。您只需在按钮单击事件中添加对“RegisterClientScriptBlock”的调用即可输出 Luke 提供的 JavaScript。

protected void buttonSubmit_Click(object sender, EventArgs e)
{ 
    try
    {
       // update the database  
       // change label text to tell the user update succeeded
       label.Text = "Message";
       string js = "function hideLabel(){document.getElementById('" + label.ClientID + "').style.display = 'none'};setTimeout(hideLabel, 5000);"
       ClientScript.RegisterClientScriptBlock(this.GetType(), "test", js ,true);
    }
    catch(Exception ex){...}
}

【讨论】：

如果您要在代码隐藏中注册它，您至少应该使用控件中的 clientid 而不是硬编码。

【解决方案3】：

您是通过 Ajax 回发还是通过普通回发？如果是正常的回发，只需在设置计时器的页面上注册一些 javascript，并在计时器到期后调用隐藏标签的函数。以下示例使用 jQuery 来确保在计时器启动之前加载 DOM，但还有其他方法。 5s后会隐藏标签。

function hideLabel(label)
{
   $(label).hide();
}

$(document).ready( function() {
    var label = $('#labelID');
    setTimer(function() { hideLabel(label); ),5000);
});

如果您使用 AJAX，这个想法基本相同，除了您在 onSuccess 回调中为 AJAX 调用而不是在文档加载时设置计时器。

【讨论】：