asp.net按钮只执行客户端代码不回送页面的方法

发布时间:2020-08-14编辑:脚本学堂
本文介绍下,在asp.net中,只执行客户端代码不回送页面的实现方法,主要介绍下思路,有需要的朋友,可以参考下。

我们知道,asp.net的Button默认行为是将页面回送后执行服务器代码。
在页面中,还可以使用html的按钮控件input type="button",不过这种HTML控件在cs文件中无法引用。

asp:Button在cs文件中可用,那么,如何使它只执行客户端javascript代码而不回送执行服务器端代码呢?

首先,介绍asp:Button的两个事件OnClientClick和OnClick,前者OnClientClick是执行客户端JavaScript代码,后者OnClick是服务器代码,先执行postback,再在服务器运行。OnClientClick要先于OnClick,如果asp:Button里没有OnClick,点击时会照样回送。

当OnClientClick返回false时,OnClick就不会执行了。这样在OnClientClick可以执行一个Ajax异步操作。
 

复制代码 代码示例:
<asp:Button ID="btnSave" runat="server" Text="Save" OnClientClick="AjaxDoSave(); return false;" />

这样这个Button就变成了客户端的input了,而且在cs文件中还可以引用,是不是很棒哦。

附,对Asp.Net自动回送的分析
  要使用自动会送,只需要把Web控件的AutoPostBack属性设为true(默认为false),当设置为true时,Asp.Net使用客户端的JS来连接客户端和服务器端的代码。

  AutoPostBack的工作方式,如果创建了一个包含一个或多个AutoPostBack属性为True的Web控件的页面,Asp.Net在呈现的HTML页面上添加一个名为_dopostback()的JS方法,当调用该方法时,它将触发回送,把窗体所有的信息回送到Web服务器。

  Asp.Net还会添加两个隐藏的输入字段,_dopostback()方法用他们把信息传回到服务器,这个信息包含引发该事件的控件的ID以及其他任何相关的可能的附加信息,这些字段起初为空,如下所示:
 

复制代码 代码示例:

  <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
  <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />

  <script type="text/javascript">
  //<![CDATA[
  var theForm = document.forms['form1'];
  if (!theForm) {
     theForm = document.form1;
  }
  function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
      }
  }
  //]]>
  </script>

  Asp.Net自动生成_dopostback()方法,这个代码将会随着页面中AutoPostBack控件数目的增长而变长,因为必须为每个控件设置控件数据。

  任何AutoPostBack属性设置为真的控件都可以通过onclick或onchange事件来连接_dopostback()方法,这些特性指示浏览器应如何相应客户端的JS脚本事件onclick和onchange。

  Asp.Net包括两种控制模型:基本的HTML服务器控件和功能完整的Web控件,只用Web控件才是提供自动会送。

有了以上的介绍,对于asp.net中的页面回送技术,是不是很清楚了。