如何在回发asp.net按钮之前运行javascript函数

Question

我有一个asp.net按钮,它是runat服务器,有一个函数句柄,回拨按钮onclick.

如何"loading ..."在进入服务器程序之前在页面中显示单词？

Answer 1

将OnClientClick连接到一些返回true或false的javascript函数.如果返回true则发生回发,否则它被取消.

  <asp:Button id="MyButton" runat="Server" Text="Close" 
                       OnClientClick="return  PromptClose();"/>


  <script type="text/javascript">
   function PromptClose(){
       return prompt("Do you really want to close this window?");
   }
  </script>

Answer 2

您可以使用onsubmit页面表格的事件.这是在提交表单之前发生的,如果您需要通过取消冒泡,将允许您停止提交表单.如果您需要此功能,此示例中的最后两行将取消浏览器中的冒泡.

<form runat="server" onsubmit="ShowLoading()">
</form>
<script type="text/javascript">
    function ShowLoading(e) {
        var div = document.createElement('div');
        var img = document.createElement('img'); 
        img.src = 'http://www.oppenheim.com.au/wp-content/uploads/2007/08/ajax-loader-1.gif'; 
        div.innerHTML = "Loading...<br />";
        div.style.cssText = 'position: fixed; top: 30%; left: 40%; z-index: 5000; width: 222px; text-align: center; background: #fff; border: 1px solid #000'; 
        div.appendChild(img);
        document.body.appendChild(div); 

        // These 2 lines cancel form submission, so only use if needed.
        window.event.cancelBubble = true;
        e.stopPropagation();
    }
</script>

上面的JavaScript仅作为示例,但是(在我看来)这是您正在寻找的首选方式.它看起来像这样(在屏幕的中央):

正在加载......
http://www.oppenheim.com.au/wp-content/uploads/2007/08/ajax-loader-1.gif

这适用于任何引发PostBack的元素,因此您不必手动调用ShowLoading()页面上可能包含的每个按钮或表单元素.我会ShowLoading()用一些真正的加载功能替换内容,而不仅仅是我把它放在一起的示例代码.

Answer 3

看看OnClientClick，你可以添加对js函数的调用，或者那里的内联JS。

或者，您可以使用 JQuery 连接到按钮并显示带有异步回调的模式对话框。