onClick和onclientclick区别

    在Web开发过程中,onclick和onclientclick都是控件的事件,有自己对应的执行对象。例如:   

<span style="font-size: 18px;">  <asp:Button ID="Button1"runat="server" OnClick="Button1_Click"Text="提交"  OnClientClick="return buttonClick();"/></span>
       在这行代码中,有一个Web控件Button,代码runat="server"是自动生成的,表明该控件在服务器端运行,换句话说,既可在.cs文件中引用该控件;OnClick="Button1_Click"表明给服务器控件增加了一个服务端事件;而OnClientClick="return buttonClick()"表明给服务器控件增加了一个客户端事件。

         对于OnClick和OnClientClick之间的关系如下:

         1 onclientclick是客户端脚本,在客户端一般使用javascript,也有用vbscript等脚本语言,也就是IE中运行,点击后马上执行,不执行回传postback。

        2onclick是服务器端事件处理函数,使用C#vb.net等语言,在服务器端,也就是IIS中运行,点击按钮后,执行postback回传postback,之后再运行。

   设计到postback,它是aspx页面回传机制问题,既页面在首次加载后向服务器提交数据,然后服务器把处理好的数据传递给客户端并显示出来,就是postback。

   对于两者之间的执行顺序,我们不妨先做一个小例子,看看效果,再定结论。


default.aspx页面中加入javascript脚本:

<span style="font-family:SimSun;font-size:18px;">    <script lang="javascript"type="text/javascript"  >
        function buttonClick() {
            alert("我是客户端代码!");
            return false ;
        }
    </script></span>

页面控件代码:

<span style="font-family:SimSun;font-size:18px;"><body>
    <form id="form1"name="form1" runat="server">
 
        <p>
            用户名:<asp:TextBoxID="TextBox1" name="textbox1"runat="server"></asp:TextBox>
        
        </p>
        <p>
            密 码:<asp:TextBoxID="TextBox2" runat="server"></asp:TextBox>
        </p>
        <asp:Button ID="Button1"runat="server" OnClick="Button1_Click"Text="提交"  OnClientClick="return buttonClick();"/>
    </form>
</body></span>
cs文件代码:

<span style="font-family:SimSun;font-size:18px;">        protected void Button1_Click(objectsender, EventArgs e)
        {
       
           Response.Write("我是服务器端点击事件!");
        }</span>
    效果怎么样?不出意外的话,结果应该是显示“我是客户端代码!”而没有显示“我是服务器端点击事件!”这是为什么呢?

    原理是:首先显示JS代码中的提示是因为:在Web服务器控件中,OnclientClick事件是优先于OnClick事件执行的,也就是说先执行的JS代码,所以显示提示,而没有显示服务端提示,是因为脚本语言的return false这句代码,这是什么意思呢:这句话决定了是否继续执行后台代码,也就是服务端代码,如果返回true,则继续执行后台代码,反之,不执行后台代码,换句话说,通过return false 来“屏蔽”服务端的程序运行,好处是可以避免面重新刷新页

所以,你可以试试当把return false改成return true会怎么样?如果把return false去掉又会怎么样呢?自己可以去尝试一下.....

   这个先后执行的顺序,让我想到了机房收费系统的一个例子(不知是否恰当),在点击登录的时候,要先进行文本框是否为空的判断,亦或是否有特殊字符等判断,通过这些客户端的验证后,才会提交给数据库判断,判断数据库中是否有该用户名,密码是否正确等判断,如果放到ASP.NET中,则判断是否为空等内容可放到客户端的javascript脚本中,如果通过验证则返回true,继续执行后台判断;如果客户端验证没有通过,则直接返回false,避免执行后台判断,减少系统的执行时间。


你可能感兴趣的:(Web,web开发,asp.net,控件)