当form表单文本框控件在收到回车事件时,默认会触发表单内第一个可提交按钮的事件,但业务中可能要求有其它控件进行提交,而不是这个默认的

这时需要脚本控件事件冒泡传递取消回事事件.

 $(document).keydown(keyListener);

 function keyListener(e)

 {

     e = e ? e : event;

     try

     {

         if (e.keyCode == 13)

         {

             if (e.preventDefault)

             {

                 e.preventDefault();

                 e.stopPropagation();

             }

             else

             {

                 window.event.returnValue = false;

             }

         }

     }

     catch (ex)

     {

     }

 }
document.onkeydown = keyListener;

        function keyListener(e)

        {

            e = e ? e : event;

            if (e.keyCode == 13)

            {

                if (document.activeElement.id == '<%=this.txtBarCode.ClientID%>')

                {

                    event.preventDefault();

                    e.stopPropagation();

                    $("#<%=this.btnQuery.ClientID%>").click();

                }

               else if (document.activeElement.id == '<%=this.txtGoodID.ClientID%>' || document.activeElement.id == '<%=this.txtSize.ClientID%>')

               {

                    e.preventDefault();

                    e.stopPropagation();

                    var huohao = $('#<%=this.txtGoodID.ClientID%>').val();

                    var chima = $('#<%=this.txtSize.ClientID%>').val();

                    if (huohao != null && huohao != '' &&

                        chima != null && chima != '')

                    {

                        <%=this.ClientScript.GetPostBackEventReference(this.btnQuery, "")%>;

                    }

                }

            }

        }

ASP.NET多个提交按钮页面，回车Enter执行指定按钮的事件(转)

 

在WEB页面上，通常SUBMIT类型的按钮会被默认指派为所在FORM表单的提交按钮

在做ASP.net WEB应用的时候，常常遇到会在同一个页面里添加多个按钮，而每个按钮肯定都会触发页面回送事件。

在ASP.NET中，只能指定一个带有runat="server"的FORM表单，因此，这个表单会指派哪个按钮为默认提交按钮呢？

不做任何处理的情况下是很难控制的，例如在同一个页面里做了N个搜索框，设计上理想的思路是在某一输入框输入关键字后，用户按ENTER键，执行当前输入的输入框对应的提交按钮，但是，实际上往往事与愿违。无论怎么提交，总是会只执行某一个按钮事件。

如果指定Form的默认按钮，可以指定Form的DefaultButton属性值为一个按钮的ID。但这样下来，回车时就永远执行这个按钮，其它按钮无法被回车触发。

网上很多方法都是使用JAVASCRIPT来进行判断，在输入框中加入KEYPRESS之类的事件，然后检查eventCode，如果是回车键，那么就指定执行某一个按钮。

这个方法不是不行，但是，并不好维护，而且在处理复杂的逻辑时，往往不好控制。

其实，ASP.NET给出了很好的解决方案，只是通常不被人注意。

首先，屏蔽浏览器提交模式，也就是说，FORM不再默认指定一个ENTER提交的按钮

方法是将控件button的UseSubmitBehavior设置为false（LinkButton和ImageButton没有这个属性，不必设置），这样这个按钮就不会接受回车提交，这样就不会出现用户焦点在页面某处聚焦时按回车提交的情况。

为什么会这样呢？查看页面源文件我们会发现本来ASP.NET的BUTTON服务器控件在发送到客户端后type="submit"，但这时UseSubmitBehavior设置为false后，type="button" ，而且多了一个onclick事件，内容是"javascript:__doPostBack('Button1','')" id="Button1"，这样，就说明，这个按钮不再是FORM的提交按钮了，而只是一个普通按钮，要提交页面必须执行click事件，所以怎么点回车，也不会执行这个按钮的提交事件。

刚才只是第一步，阻止了默认的提交。但是，我们要的效果是回车可以提交啊。只是设置这一个属性当然无法达到我们想要的效果。

接下来，我们要了解Panel控件。

其实Panel控件是非常有用的，他是一个容器，在ASP.NET的Panel控件中有一个属性 DefaultButton， 这个属性在ASP.NET的Form控件中也有（前有叙述）。

Panel是一个特殊的控件 MSDN上的说明是：使用Panel 控件来组织 Form、另一 Panel 或模板中的内容和控件。

也就是说Panel是ASP.NET对Form的一个补充，可以给表单分区域的控件，这也是为什么ASP.NET AJAX容器使用该控件的原因。

我们都知道，ASPX只能有一个runat=“server”的FORM表单，那么要进行细致，具体的FORM操作怎么办，那么就得靠Panel控件

这里，我们就会用到Panel的这个功能

将一组输入框和按钮放在一个Panel中，指定该Panel的DefaultButton属性为按钮ID，这样，当用户焦点处于这个Panel内的某一控件时，点击回车就会执行这个Panel的DefaultButton所指定的按钮。

Panel是Form的补充控制，可以通过使用Panel对表单进行更多的操作，这样，ASP.NET只能拥有一个Form所引起的一些困难都可以迎刃而解。

原文 http://blog.sina.com.cn/s/blog_568e662301018n2i.html

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

 <html>

 <head>

     <meta http-equiv="Content-Type" content="text/html; charset=GBK">

     <title>submit例子 - aspxhome.com</title>

 </head>

 <body>

     <h1>本demo演示在文本框中按enter键是否触发提交表单</h1>

     <h2>默认情况下，一个文本框的时候，提交，不管按钮type是submit还是button</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="button" value="提交">

     </form>

     <h2>一个文本框的时候怎么才能做到不提交，方法是加一个隐藏掉的文本框</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="text" style="display:none">

         <input type="button" value="提交">

     </form>

     <h2>只要有type为submit的按钮存在，一个文本框还是多个文本框都提交</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="submit" value="提交">

     </form>

     <h2>只要有type为submit的按钮存在，一个文本框还是多个文本框都提交</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="text">

         <input type="submit" value="提交">

     </form>

     <h2>多个文本框的时候，不提交，用type为button的按钮就行啦</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="text">

         <input type="button" value="提交">

     </form>

     <h2>用button元素时，FX和IE下有不同的表现</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="text">

         <button>提交</button>

     </form>

     <h2>radio和checkbox在FX下也会触发提交表单，在IE下不会</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="radio" name="a">

         <input type="checkbox" name="b">

         <input type="checkbox" name="c">

         <input type="button" value="提交">

     </form>

     <h2>type为image的按钮，等同于type为submit的效果</h2>

     <form action="http://www.csdn.net">

         <input type="text">

         <input type="text">

         <input type="image" src="/images/logo.gif">

     </form>

 </body>

 </html>

Asp.Net Form表单控件的回车默认事件的更多相关文章

  1. 如何给动态添加的form表单控件添加表单验证

    最近使用jQuery Validate做表单验证很方便,api地址为http://www.runoob.com/jquery/jquery-plugin-validate.html 但是在使用的时候也 ...

  2. Flutter Form表单控件超全总结

    注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Form.FormField.TextFormField是 ...

  3. 前端 HTML body标签相关内容 常用标签 表单标签 form 表单控件分类

    表单控件分类 input标签: input标签 type属性的text,password,button按钮,submit按钮 input标签placeholder属性 标签上显示内容 input标签 ...

  4. form表单控件

    $("select option[value='" + queryparams['vendor'] + "']").attr("selected&qu ...

  5. JSP常用Form表单控件

    [easyui]--combobox--赋值和获取选中的值 /初始化下拉选框 $('#communityIdDiv').combobox({ url:basepath+"pushContro ...

  6. bootstrap -- css -- 表单控件

    若干css样式 .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14p ...

  7. html—表单控件

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. C#中缓存的使用 ajax请求基于restFul的WebApi(post、get、delete、put) 让 .NET 更方便的导入导出 Excel .net core api +swagger(一个简单的入门demo 使用codefirst+mysql) C# 位运算详解 c# 交错数组 c# 数组协变 C# 添加Excel表单控件（Form Controls） C#串口通信程序

    C#中缓存的使用   缓存的概念及优缺点在这里就不多做介绍,主要介绍一下使用的方法. 1.在ASP.NET中页面缓存的使用方法简单,只需要在aspx页的顶部加上一句声明即可:  <%@ Outp ...

  9. C# 添加Excel表单控件（Form Controls）

    在Excel中,添加的控件可以和单元格关联,我们可以操作控件来修改单元格的内容,在下面的文章中,将介绍在Excel中添加几种不同的表单控件的方法,包括: 添加文本框(Textbox) 单选按钮(Rad ...

随机推荐

  1. orangepi one AP模式配置

    前两天买了一块orangepi one开发板,目的是做个局域网共享目录,具体共享协议用samba:这块板子有两个网卡,一个有线一个无线:有线主要用来ssh登陆调试,修改配置. 首先下载armbian的 ...

  2. 移动App测试中的最佳做法

    一说起软件测试,测试员想到肯定是去检查文件,功能,API,性能并确定软件是否安全,以及关于软件特定部分的其他事项.但是对于移动测试,测试员不得不基于用户移动使用模式考虑移动相关的功能. 本文是基于我的 ...

  3. Firebug: 已拦截跨源请求：同源策略禁止读取位于XXX的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-

    第一种,就是在被请求的程序中添加HTTP头,即CORS跨域(跨域资源共享,Cross-Origin Resource Sharing) 如: Response.Headers.Add("Ac ...

  4. 分享张鑫旭大神的，纯css打字小技巧，我顺便收藏一下

    CSS代码: .typing { width: 15em; white-space: nowrap; border-right: 2px solid transparent; animation: t ...

  5. validation-api各注解的用法

    入参用@Valid,要不下面实体类中的注解不生效 @AssertFalse 被注解的元素必须为false@AssertTrue 被注解的元素必须为True@DecimalMax(value) 被注解的 ...

  6. java基本类型和数字类及其相关计算

    --- java 八大基本类型 byte  short int long double float boolean char --对应的包装类 Byte Short Integer Long Doub ...

  7. SSM连接数据库自动生成问题

    错误的结果为: 程序里面写的sql语句放在数据库里面去查询能查询到数据,但是程序里面查询时候,返回的结果为null 记录一下 我出现的原因是: 数据库的字段  account_id    accoun ...

  8. PLC之六部十层电梯整体框架

    1.基本框架 此图基于西门子杯逻辑控制赛项中电梯题目的变量表以及功能设计 1.I/O输入是指变量表中的input数字量,包括电梯所有的内呼按钮.外呼按钮.电梯平层开关等 2.逻辑处理是指根据相对应的输 ...

  9. Server Tomcat v7.0 Server at localhost failed to start.解决办法

    今天,导入maven项目时,报的错,因为之前没遇到过这个错,一时抓不到头绪,最后请技术大神帮忙解决.他首先看的eclipse的配置,是否与项目对应,在看看.seting 文件中的名称是否与项目名对应, ...

  10. LeetCode 57 插入区间

    题目: 给出一个无重叠的 ,按照区间起始端点排序的区间列表. 在列表中插入一个新的区间,你需要确保列表中的区间仍然有序且不重叠(如果有必要的话,可以合并区间). 示例 1: 输入: intervals ...