Asp.Net 的 WebForm 中光标在文本框时按回键默认就会提交表单，多数时候确实带来了很好的用户体验，输入数据后，手不用离开键去乱摸鼠标就能完成表单的提交。但总有例外不想要这种默认行为，一定有的，你遇到了就知道的，比如想在文本框中回车做别的事情，那就要点技巧的。
很多人可能会告诉你对文本框加个事件，回车的时候把 keyCode 由 13 变为 9(其实 keyCode 变为 9 是使回车相当于 Tab 键的功能)，不过还未完事，你并没有阻止事态进一步蔓延，Form 还是提交了。
|
1 2 3 4 5 6 7 8 9 |
$(document).ready(function() { $("#txt").keypress(function(event) { if (event.keyCode == 13) { event.keyCode = 9; //do some of your things } }); }); |
其实你要了稍加解浏览器的冒泡的事件模型，知道怎么适时的阻止浏览器的默认行为，有一个链接 http://kb.cnblogs.com/a/1363417/ 值得看下，内容如下：
在前端开发工作中，由于浏览器兼容性等问题，我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”。
1..停止事件冒泡
JavaScript代码
|
1 2 3 4 5 6 7 8 |
//如果提供了事件对象，则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的stopPropagation()方法 e.stopPropagation(); else //否则，我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true; return false; |
2.阻止浏览器的默认行为
JavaScript代码
|
1 2 3 4 5 6 7 8 |
//如果提供了事件对象，则这是一个非IE浏览器 if ( e && e.preventDefault ) //阻止默认浏览器动作(W3C) e.preventDefault() else //IE中阻止函数器默认动作的方式 window.event.returnValue = false return false; |
|
1 2 3 4 5 6 7 8 9 10 |
$(document).ready(function() { $("#txt").keypress(function(event) { if (event.keyCode == 13) { event.preventDefault(); //do some of your things } }); }); |
以上代码用了最流行的 jQuery 来附加事件函数。这样可以试下，在 IE7/IE8 的兼容模式下、Opera、FireFox 文本框中按回车都不再提交表单了。
对于 IE 浏览器，用 window.event.returnValue = false; 来替代 event.preventDefault(); 也是可以的，其实不防加个浏览器判断把 window.event.returnValue = false; 也写保险些，反正用 jQuery 判断浏览器也方便，注意不是 event.returnValue = false; 哦，window 少不得。
当然若是在表单中没有放置提交按钮，文本框中任何时候按回车都不会提交，加上个提交按钮，即使是个隐藏的提交按钮后文本框才能获得这种默认行为。所以这也给了我们另一种解决回车不提表单的解决办法，把提交按钮改为普通按钮，给该普通按钮加个 onclick="this.form.submit()" 即可。
总结一下有三种办法：
2. 提交按钮改为普通按钮，onclick 中进行表单提交
3. 给表单加个隐藏的密码框也能达到如此效果
另外再加一个取巧的办法，给表单加一个不可见的 <input type="password" style="display:none"> 也能引起按回车而不提交表单的。
附录：
其实要用 jQuery 可以随时随地，直接通过 Google CDN 来加载就行，不用担心 Google 会不会当掉，只会出现被墙掉的可能。参考：http://code.google.com/apis/libraries/devguide.html#jquery，
用 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js "></script> 加载 jquery 库
或者用：<script type="text/javascript" src="http://www.google.com/jsapi?key=INSERT-YOUR-KEY"></script>，要先到 Google API key 注册一个 Key，放到 INSERT-YOUR-KEY 位置，然后就随时用如下的某一代码加载任何你想要脚本库：
|
1 2 3 4 5 6 7 8 9 10 11 |
google.load("chrome-frame", "1.0.2"); google.load("dojo", "1.5"); google.load("ext-core", "3.1.0"); google.load("jquery", "1.4.2"); google.load("jqueryui", "1.8.2"); google.load("mootools", "1.2.4"); google.load("prototype", "1.6.1.0"); google.load("scriptaculous", "1.8.3"); google.load("swfobject", "2.2"); google.load("yui", "2.8.1"); google.load("webfont", "1.0.6"); |
本文链接 https://yanbin.blog/textbox-no-enter-submit/, 来自 隔叶黄莺 Yanbin Blog
[版权声明] 
本文采用 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 进行许可。