首页 > 代码库 > 【转】ASP.NET的OnClientClick与OnClick事件【解决了“识别用户在对话框里面选yes或no的问题”】

【转】ASP.NET的OnClientClick与OnClick事件【解决了“识别用户在对话框里面选yes或no的问题”】

OnClientClick是客户端事件方法.一般采用JavaScript来进行处理.也就是直接在IE端运行.一点击就运行.

OnClick事件是服务器端事件处理方法,在服务器端,也就是IIS中运行.点击按钮后,执行postback,再运行.

如果一个按钮上我们同时有客户端的OnClientClick方法又有OnClick事件处理方法,如何才能按照正常的逻辑运行呢?

OnClientClick中我们常用来做一些客户端的检测.当然放在服务器也可以做同样的检测,但这样做的代价是与服务器进行交互,消耗资源。

例:

test()为一javascript函数.

 1 <script type="text/javascript"> 2         function test() 3        { 4             var value = http://www.mamicode.com/document.getElementById("%=t1.ClientID%>").value; 5             if (value =http://www.mamicode.com/="")  6             { 7                 alert("不能为空值"); 8                 return false; 9             }10         }11 </script>        

t1为一文本框,判断输入内容是否为空

<asp:TextBox ID="t1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="提交"  OnClientClick="return test()" onclick="Button1_Click"  />

需要注意的是当我们当击这个按钮时,自动先执行的客户端,再执行服务器端的.如果客户端返回的是false,那么服务器端对应的方法永远不会执行.这样就达到检测,只有通过才去执行服务器端的方法.

也就是说如果我们上面写成:

<asp:Button ID="Button1" runat="server" Text="提交"  OnClientClick="test();return false" onclick="Button1_Click"  />

那么不管test()执行的结果如何.服务器端对应的Button1_Click方法都永远不会执行.因为return false使得始终使客户端返回false

如果我们写成:

<asp:Button ID="Button1" runat="server" Text="提交"  OnClientClick="test()" onclick="Button1_Click"  />

那么Button1_Click都有会发生.同样也就达不到效果.也就是说你没有通过检测也去执行服务器的方法了.

 

另外:

我们还可以通过Button1.Attributes.Add("onclick", "test()");的方法来触发客户端事件。

 

以上来自:http://blog.163.com/huang_qy/blog/static/615601452012101535413943/

======================================================================================

相类似的文章:http://blog.csdn.net/goodshot/article/details/8645740

 

OnClick与OnClientClick对于菜鸟的我来说真的花了一点时间去搞清楚。OnClientClick是在客户端方面运行的。而OnClick是会postback在服务器端运行的(这挺废话的)。但这里存在著执行时间和條件。時序性:网页上点击一个button第一个先触发的是客户端的OnClientClick,然後才會執行OnClick。條件性:要在 OnClientClick返回true的情況下,OnClick才會被后续执行。在网页默认的情况下:OnClientClick执行函数后,如果函数没有返回值OnClientClick会返回true,所以可以让OnClick顺利执行但也存在着某些时候不让OnClick执行的价值。例如使用 Javascript进行用户的第一层验证或基本的检查工作。如果不符合条件就不触发OnClick回到服务器端继续逻辑。

那么在这种情况下就要人为的将OnClientClick的返回弄成 false。做法很简单。定义一个根据检测条件返回true或者false值的Javascript或vbscript函数。然后在 OnClientClient调用。方法是OnClientClick=“return fun(真是你定义的Javascript或vbscript函数);”这样就可以达到符合条件才会触发OnClick,不符合条件不触发 OnClick。  

 

对于LinkButton我们做了一个实验,测试成功了:

<script type="text/javascript">
    function delete_user( obj)
    {

      var r=confirm("确认删除此用户?");
      return r;

     }

</script>

.......

<td><asp:LinkButton ID="LinkButtonDeleteUser" runat="server" CommandName="Order" CommandArgument=‘<%# Eval("UserName") %>‘ OnCommand="LinkButtonDeleteUser_Command"  OnClientClick="return delete_user(this);" >删除用户</asp:LinkButton></td>

.......

该操作是当用户在页面点解“删除用户”的链接按钮时,先弹出“确认删除此用户?”的信息框,如果用户选择的是确定时才执行删除用户的操作。

 学习资料:

http://msdn.microsoft.com/zh-cn/library/dd410060

这里详细介绍了ASP.NET 提供的两种方法如何用来实现客户端功能。

http://www.w3school.com.cn/aspnet/aspnet_refwebcontrols.asp

这里包括了ASP.NET中所有WEB服务器控件的属性和使用方法

======================================================================================

 

相类似的问题的文章:

http://www.cnblogs.com/BensonHe/articles/1780987.html

 

服务器控件妙用OnClientClick事件阻止回传

很多时候,我们需要对服务器控件的输入内容进行验证,如果在后台.cs页面进行验证,则会刷新页面,在用户体验和效率方面都不划算,其实完全可能在客户端使用javascript进行验证,只要编写客户端事件OnClientClick便可以了。OnClientClick会在OnClick事件之前触发。如果OnclientClick事件函数返回false,那么控件不再回传,即OnClick事件也不会再执行。见下例:

    <script type="text/javascript">

         function check() {

              var input = document.getElementById("text1").value;

              if(input == null || input == "")

              {

                     alert("文本框不能为空!");

                     return false;

              }

              return true;

         }

    </script>

    <div>

      <asp:TextBox ID="text1" runat="server"></asp:TextBox>

      <asp:Button ID="summitBtn" runat="server" Text="提交" OnClick="summitBtn_Click" OnClientClick="return check();" />

   </div>

    因为check()函数有返回值,所以前面的return关键字不能漏掉。如果检验通过,即返回true,则summitBtn_Click会继续执行,可以在summitBtn_Click中对表单的数据进入数据库操作。

======================================================================================