ASP.NET中多按钮回车键触发form的submit的实现方法
一般网站登录、注册填写完信息后,直接回车提交就可以登录或者注册了,没必要一定要单击鼠标确认, 能不能做到实现这样的功能啊?
当然可以,在ASP.NET中,一个form中的第一个加入到form中的按钮就是默认按钮,按回车就可以触发点击事件。
那么如果一个页面多个submit按钮,我怎么知道用户回车是想登录还是注册还是其他呢?,我们可不可以实现这样的功能呢?
答案也是肯定的,下面介绍两种方法(第一种是网上找来的,不太可行)
方案一,利用脚本实现:
$(function() {
//搜索按钮
$("#txtSearch").keypress(function(e) {
var key = window.event ? e.keyCode : e.which;
if (key.toString() == "13") {
$("#btnSearch")[0].click();
}
});
//登录按钮LoginPwd
$("#loginPwd").keypress(function(e) {
var key = window.event ? e.keyCode : e.which;
if (key.toString() == "13") {
$("#btnlogin")[0].click();
}
});
//密码忘记
$("#txtRecPwd").keypress(function(e) {
var key = window.event ? e.keyCode : e.which;
if (key.toString() == "13") {
$("#btnRecPwd")[0].click();
}
});
});
方案二,用ASP.NET里自带的defaultButton属性:
ASP.NET 2.0中为此提供了很好的解决方法。只需要将"defaultbutton"属性指定到想要引发事件的按钮控件的 ID上就可以了。
在表单级别和面板级别(<asp:panel> 标记)均可以指定"defaultbutton"。当表单和面板中同时指定了defaultbutton,则如果在面板中触发了"Enter key",则执行面板中的
下面的实例代码中有一个表单和4个面板,报单和面板中都有按钮。请各位注意:在文本框中回车后会触发哪些按钮的事件
<form > <div> <asp:TextBox runat="server"></asp:TextBox> <asp:Button runat="server" Text="Cancel" OnClick="Button5_Click" /> <asp:Button runat="server" Text="Submit" OnClick="btn1_Click" /> <asp:Panel runat="server" defaultbutton="Button1"> <asp:TextBox runat="server"></asp:TextBox> <asp:TextBox runat="server"></asp:TextBox> <asp:Button runat="server" Text="Button1" OnClick="Button1_Click" /> </asp:Panel> <asp:Panel runat="server" defaultbutton="Button2"> <asp:TextBox runat="server"></asp:TextBox> <asp:TextBox runat="server"></asp:TextBox> <asp:Button runat="server" Text="Button2" OnClick="Button2_Click" /> </asp:Panel> <asp:Panel runat="server" defaultbutton="Button3"> <asp:TextBox runat="server"></asp:TextBox> <asp:TextBox runat="server"></asp:TextBox> <asp:Button runat="server" Text="Button3" OnClick="Button3_Click" /> </asp:Panel> <asp:Panel runat="server" defaultbutton="Button4"> <asp:TextBox runat="server"></asp:TextBox> <asp:TextBox runat="server"></asp:TextBox> <asp:Button runat="server" Text="Button4" OnClick="Button4_Click" /> </asp:Panel> </div> </form>