在asp.net引入事件驱动之后,在一个页面上很容易解决多个按钮触发不同事件的问题,避免了在asp中需要多个form或者通过js脚本来控制 的麻烦。

asp.net带来便利的同时,也带来一个问题。在实际应用中一个页面存在多个按钮的情况并不多。用户习惯于在输入框输入内容之后,直接按回车就提 交表单了。由于asp.net采用的是事件驱动模式,所以默认用户按回车并没有触发按钮的onclick事件。用户按回车也不是没有提交表单,通过httpwath可以看到,实际上页面表单是提交到了form下的action页 面,只不过没有触发onclick事件而已。

在asp.net事件驱动模式下面,要实现通过回车来触发事件,必须要借助js脚本来实现。

在asp.net的aspx页面中,form的代码:
<form id="form1" runat="server">

但在访问页面的源代码中可以看到:
<form name="form1" method="post" action="Default.aspx" id="form1">

所以在输入框默认直接按回车,其实就是把表单提交到了form的action对应的页面,而并没有触 发任何事件。

奇怪的地方:当一个aspx页面上没 有使用web控件的时候,在输入框里按回车,默认是不会触发任何一个button按钮的onclick事件;但当页面上 有使用web控件的时候,在输入框里按回车,默认会触发第一个button的onclick事件。【这里的第一指页面代码 中最先出现的button控件,包括web控件内的button控件】

下面说说如何通过js来触发button按钮的onclick事件。

默认的button控件,在html中的代码是这样的:
<input type="submit" name="Button1" value="Button" id="Button1" />

实际 上点击这个button触发的onclick事件调用了一个js脚本:__doPostBack(eventTarget, eventArgument)

button 控件有个属性:UseSubmitBehavior,默认是true,当你修改为false的时候,再去看html的源代码,就能清楚的看到调用的js脚 本函数。
<input type="button" name="Button1" value="Button" onclick="javascript:__doPostBack('Button1','')"id="Button1" />

生成的js脚本:
<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>

了解了这块内容,要处理输入框按回车触发button的onclick事件就简单的多了,就是截获输入框按回车的这个动 作,然后通过js调用__doPostBack这个函数就OK了

输入框:
<input name="TextBox1" type="text" id="TextBox1" onkeydown="return KeyDown('Button1');" />
<input type="submit" name="Button1" value="Button" id="Button1" />

js脚本
        function KeyDown(btn) {
            if (event.keyCode != 13) //按键不是enter键
          {
                return;
            }
            else //按键是enter键
            {
                try {
                    __doPostBack(btn, '');
                    return false;
                }
                catch (e) {
                    alert(e);
                    return;
                }
            }
        }

如果要输入框和button控件是在web控件里的,就需要特别注意:
控件中的button控件生成的html代码:
<input type="submit" name="WUC11$Button2" value="Button" id="WUC11_Button2" />
__doPostBack中用到的是input按钮的name属性,web控件中button,在生成的html代码里会加上控件的ID,所以传递的 button名称不要写错了。

转载于:https://www.cnblogs.com/JensonBin/archive/2011/02/21/1960042.html

js触发asp.net的Button的Onclick事件相关推荐

  1. js按钮触发网页提醒_js触发asp.net的Button的Onclick事件应用

    在asp.net引入事件驱动之后,在一个页面上很容易解决多个按钮触发不同事件的问题,避免了在asp中需要多个form或者通过js脚本来控制的麻烦. asp.net带来便利的同时,也带来一个问题.在实际 ...

  2. php事件编程,PHP相应button中onclick事件的案例分析

    PHP相应button中onclick事件的案例分析 发布时间:2020-11-10 11:28:31 来源:亿速云 阅读:71 作者:小新 小编给大家分享一下PHP相应button中onclick事 ...

  3. onclick 调用php,php中如何响应button的onclick事件

    PHP是服务器端代码 ,html是客户端代码,实现button的onclick事件,就是客户端调用服务器端函数,因此就得向服务器提交请求. 有一种简单粗暴的方式,就是button是a标签时,可以直接在 ...

  4. php button onclick,php实现button的onclick事件的方法

    php实现button的onclick事件的方法 发布时间:2020-06-25 14:16:47 来源:亿速云 阅读:141 作者:Leah 本篇文章为大家展示了php实现button的onclic ...

  5. aspx.net响应点击事件(页面button的onclick事件)

    aspx.net响应点击事件(页面button的onclick事件) aspx.net制作网页还是比较简单的,直接动态网页并且连接数据库都是so easy首先在页面代码片: <form id=& ...

  6. android onclick方法吗,Android中button的onClick事件几种方法

    Android中button的onClick事件几种方法 发布时间:2020-09-03 02:36:31 来源:脚本之家 阅读:100 作者:水桶前辈 Android中button的onClick事 ...

  7. Asp.Net回车键触发Button的OnClick事件解决方案

    在aspx页面有textbox文本框,还有三个button按钮.启用textbox的TextChanged事件和button的click事件. 问题: 现在在textbox文本框输入完数据按" ...

  8. 基础知识收藏(ASP.NET的OnClientClick与OnClick事件)-2013.07.10

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

  9. js代码中for循环里绑定onclick事件报错Uncaught TypeError Cannot set properties of undefined (setting ‘className‘)

    jsfor循环里绑定onclick事件报错Uncaught TypeError Cannot set properties of undefined (setting 'className') 我想要 ...

最新文章

  1. 王璋等揭示慢性阻塞性肺疾病炎症内型与呼吸道微生物组的关系(IF 21)
  2. 广东生态所孙蔚旻团队EST发表尾矿微生态调查两部曲
  3. Flex3.0 图片浏览器(平移、光标中心点放缩、任意角度旋转)
  4. 若能回到五年前,我会告诉自己这些创业道理
  5. 关于使用两个GTP/GTX出现[DRC RTSTAT-1]error([route 35-54] critical warning)的问题详解
  6. Python爬虫入门七正则表达式
  7. linux查看端口被哪个服务占用的命令
  8. 走入asp.net mvc不归路:[4]说说Action有哪些常见成员
  9. cesium 圆形波动
  10. Chrome 45 减少了内存占用
  11. 【转】用C#获取浏览文件夹对话框
  12. Flash学习资源汇编
  13. 校园edu无网络访问解决方案
  14. 小旭追女神-三国乱世(裸的单点线段树更新)
  15. 【我为车狂性感车模win7主题】
  16. eemd优缺点_改进EEMD算法在心电信号去噪中的应用
  17. CAD:AutoCAD快捷键指令大全(非常值得收藏),本人项目案例实践积累总结
  18. 女生29岁 ,想学前端,还来得及么?
  19. 美国未来计算机人才需求,对话美国帕森斯前院长:“未来人才需求趋势”
  20. linux安装vsftpd服务,Linux系统安装Vsftpd

热门文章

  1. 网站需要数据库服务器吗,网站需要独立的服务器数据库吗
  2. mfc tabcontrol 修改白色背景_初级会计报名准备工作如何使用美图秀秀PC版修改照片尺寸、格式、大小...
  3. 线谱法 时钟分量的提取 matlab,LMD局域均值分解的matlab程序及示例
  4. 查找整数c语言编程,关于算法:查找整数的位数
  5. java自学笔记_JAVA自学笔记(4)
  6. centos修改磁盘uuid_为什么MySQL用uuid做主键会被骂?
  7. SQLServer 条件查询语句大全
  8. php替换算法,PHP实现各种经典算法 || 我们的爱的博客
  9. ARMA模型的性质之方法性工具
  10. 没有bug队——加贝——Python 53,54