我有一个页面,它有两个按钮,btnSearch和btAddUser。aspx页面如下。正如您所看到的,默认按钮是btAddUser。但当我在文本框txtFilter中键入内容时,我想将默认按钮设置为btnSearch。我添加了一个JavaScript函数clickButton,并在page_load中添加了以下代码。问题是,当我在文本框中键入内容后按enter键时,btnSearch和btAddUser都会被单击。有什么办法可以让btAddUser不被点击吗。
txtFilter.Attributes.Add("onkeypress", "return clickButton(event, '" + btnSearch.ClientID + "')");
<asp:Panel ID="MainPanel" runat="server" DefaultButton="btnAddUser">
<table align="center" width="900">
<tr>
<td align="left" width="70%">
<asp:TextBox ID="txtFilter" runat="server" Width="200"></asp:TextBox>
<asp:Button ID="btnSearch" runat="server" Text="Search"
onclick="btnSearch_Click" CausesValidation="false" />
</td>
<td align="right" width="30%">
<asp:Button ID="btnAddUser" runat="server" Text="Add User" Width="85px"
CausesValidation="False" onclick="btnAddUser_Click" />
</td>
</tr>
<tr>
...
</asp:Panel>
function clickButton(e, buttonid) {
var evt = e ? e : window.event;
var bt = document.getElementById(buttonid);
if (bt) {
if (evt.keyCode == 13) {
bt.click();
return false;
}
}
}
更新:在谷歌上搜索后,我找到了如下的解决方案。它似乎起作用了。但它在Firefox上不起作用?有人知道如何解决吗?
function clickButton(e, buttonid) {
var evt = e ? e : window.event;
var keycode = evt.keyCode || evt.which || evt.charCode;
var bt = document.getElementById(buttonid);
if (bt) {
if (keycode == 13) {
evt.cancelBubble = true;
evt.returnValue = false;
if (evt.stopPropagation) {
evt.stopPropagation();
evt.preventDefault();
}
bt.click();
return false;
}
}
}
您不需要javascript,只需将搜索文本框包装在另一个面板中并设置默认按钮,类似于这样(我去掉了表标签):
<asp:Panel ID="MainPanel" runat="server" DefaultButton="btnAddUser">
<asp:Panel ID="searchPanel" runat="server" DefaultButton="btnSearch">
<asp:TextBox ID="txtFilter" runat="server" Width="200"></asp:TextBox>
<asp:Button ID="btnSearch" runat="server" Text="Search"
CausesValidation="false" onclick="btnSearch_Click" />
</asp:Panel>
<asp:Button ID="btnAddUser" runat="server" Text="Add User" Width="85px" CausesValidation="False" onclick="btnAddUser_Click" />
</asp:Panel>
将TextBox
封装在Panel
中,并设置DefaultButton
属性。
<asp:Panel runat="server" DefaultButton="btnSearch">
<asp:TextBox ID="txtFilter" runat="server" Width="200" />
<asp:Button ID="btnSearch" runat="server" Text="Search"
onclick="btnSearch_Click" CausesValidation="false" />
</asp:Panel>
JavaScript
<script language="javascript" type="text/javascript">
function kPress(evnt, ID) {
var ButtonID = ID.id;
var btnSearchID = ButtonID.replace('txtFilter', 'btnSearch');
document.getElementById(btnSearchID).click();
}
</script>
HTML
<asp:TextBox ID="txtFilter" runat="server" Width="200" onkeypress="kPress(event, this);"></asp:TextBox>