我正在使用 asp(移动)开发 Web 应用程序。
当使用 iPhone 浏览器在搜索文本框 ( <mobile:TextBox ID="txtSearchData" Runat="server" BreakAfter=False></mobile:TextBox> ) 中输入一些搜索文本时， iPhone 会启动搜索键盘，当我使用 iPhone 键盘单击搜索按钮时，它会刷新整个页面，但单击文本框下方的搜索按钮它工作正常。
谁能告诉我如何解决这个问题？
到目前为止，这是我的代码:
<body>
<mobile:Form ID="frmSearch" Runat="server" Font-Name="NotSet" Font-Size="Small">
<mobile:DeviceSpecific ID="dsSearch" Runat="server">
<Choice Filter="isHTML32">
<ScriptTemplate>
<link href="StyleSheets/Common.css" rel="stylesheet" type="text/css"></link>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta id="Meta1" name="viewport" content="width=device-width; initial-scale=1.0;" />
</ScriptTemplate>
<HeaderTemplate>
<table cellspacing="2" width="100%">
<tr>
<td width="100%">
<uc1:Header ID="ucHeader" runat="server" />
</td>
</tr>
</table>
<table>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td align="right">
Find :
</td>
<td>
<mobile:DeviceSpecific>
<Choice="isHTML32">
<ContentTemplate>
<asp:DropDownList ID="lstGroups" runat="server" OnSelectedIndexChanged="LstGroups_SelectedIndexChanged" AutoPostBack="true">
</asp:DropDownList>
</ContentTemplate>
</Choice>
</mobile:DeviceSpecific>
</td>
</tr>
<tr>
<td align="right"> Search by:</td>
<td>
<mobile:SelectionList ID="lstSearchPreferences" Runat="server" BreakAfter=False>
<Item Selected=True Text="select" />
</mobile:SelectionList>
</td>
</tr>
<tr>
<td> </td>
<td>
<mobile:SelectionList ID="lstSearchOptions" Runat="server" BreakAfter=False>
</mobile:SelectionList>
</td>
</tr>
<tr>
<td> </td>
<td>
<mobile:TextBox ID="txtSearchData" Runat="server" BreakAfter=False>
</mobile:TextBox>
</td>
</tr>
<tr id="trContractorFilter" runat="server" visible="False">
<td align="right">
<mobile:Label id="lblContractorFilter" BreakAfter=False Runat="server" Visible="True" >
Results:
</mobile:Label>
</td>
<td>
<mobile:SelectionList ID="lstContractorFilter" Runat="server" BreakAfter="True" Visible ="True" >
<Item Selected="True" Text="Active Permits" />
<Item Text="All Permits" />
</mobile:SelectionList>
(your permits only)
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td colspan="2" align="center">
<mobile:DeviceSpecific>
<Choice="isHTML32">
<ContentTemplate>
<asp:Button ID="btnSearch" runat="server" Text="Search" UseSubmitBehavior=true OnClick="BtnSearch_Click"/>
</ContentTemplate>
</Choice>
</mobile:DeviceSpecific>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<mobile:Label ID="lblError" Runat="server" Font-Bold="True" ForeColor=Red Visible="false" BreakAfter=False></mobile:Label>
</td>
</tr>
</table>
</HeaderTemplate>
</Choice>
</mobile:DeviceSpecific>
</mobile:Form>
</body>
最佳答案
结合this question及其使用 jQuery 的答案，您可以在页面中编写相同的代码并在触发提交之前进行客户端处理。
此外，您可以使用 $.ajax() 库函数异步提交表单(在上面讨论的代码块内，而不触发 form.submit()完全没有)，这将消除任何页面刷新(无论从何处触发表单提交事件。)
<form id="hello-world" action="sayhello">
<input type="submit" value="Hello!">
</form>
您可以像这样附加一个事件处理程序:
$('#hello-world').submit(function(ev) {
ev.preventDefault(); // to stop the form from submitting
/* Validations go here */
//this.submit(); // If all the validations succeeded
$.ajax({
url:'your_form_target',
data:formData,
success:function(data,textStatus, jqXHR){
}
});
});
关于iphone - 使用 iPhone 浏览器处理搜索按钮？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8603996/