Textbox控件注册回车事件及触发按钮提交事件具体实现

172 阅读 0 评论 114 点赞

我是靠谱客的博主忧郁中心，最近开发中收集的这篇文章主要介绍Textbox控件注册回车事件及触发按钮提交事件具体实现，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

引子：
在ASP.Net页面中textbox的index为1（或n）,其后的提交按钮index为2（n+1）,光标在textbox中,回车后自动焦点移动到后面的button上,会触发button的点击事件。

但在Lyncplus客户端中访问Web页面时遇到了TextBox控件回车自动完成按钮的提交事件失效的情况(应该是自动切换焦点)。

由于并且该服务端TextBox控件没有提供OnKeyPress或OnKeyDown等事件，也无法针对回车事件写后台代码来调用Button按钮的点击事件。

于是上网查找相关的介绍，最终解决了以下两个问题：
（一）、实现在TextBox控件回车事件中执行JS代码，来控制页面元素的值。
（二）、实现在TextBox控件回车事件中调用服务端控件的点击事件，来执行服务端C#代码，实现相关的功能。
具体实现如下：
一、注册和触发服务端TextBox控件回车事件
1.PageLoad事件代码：

复制代码代码如下:

 
protected void Page_Load(object sender, EventArgs e) 
{ 
MessageTxt.Attributes.Add("onkeypress", "EnterTextBox()"); 
MessageTxt.Attributes.Add("onkeydown", "EnterTextBox()"); 
} 

2.javascript代码：

复制代码代码如下:

 
<script language="javascript"> 
function EnterTextBox() { 
if (event.keyCode == 13 && document.all["MessageTxt"].value != "") //按下了回车，并且文本框里有值 
{ 
$("#<%=hidKeywords.ClientID%>").val($("#<%=MessageTxt.ClientID%>").val().replace(/[^u0000-u00FF]/g, 
function ($0) { 
return escape($0).replace(/(%u)(w{4})/gi, "&#x$2;") 
})); 
} 
} 
</script> 

二、TextBox控件回车事件中调用服务端Button控件点击事件
1.PageLoad事件代码：同上。

复制代码代码如下:

 
protected void Page_Load(object sender, EventArgs e) 
{ 
MessageTxt.Attributes.Add("onkeypress", "EnterTextBox()"); 
MessageTxt.Attributes.Add("onkeydown", "EnterTextBox()"); 
} 

2.javascript代码：注意使用原始的dom对象获取按钮，使用Jquery获取不到。

复制代码代码如下:

 
<script language="javascript"> 
function EnterTextBox() { 
var button = document.getElementById('<%=btnSearch.ClientID%>');//获取服务端控件对应的页面对象 
if (event.keyCode == 13) //按下了回车 
{ 
　 button.click(); 
event.returnValue = false; 
} 
} </script> 