我正在Phonegap中构建一个应用程序,我面临的问题仅在测试产品后才出现。我的问题如下:
我有一个包含2个输入字段和登录按钮的登录页面。单击输入字段时,设备上的虚拟键盘会正确显示。问题是当输入字段为空并且单击按钮时。除了错误消息外,当单击警报上的完成按钮时,键盘也会出现并消失。
如何阻止键盘与错误信息一起显示?
编辑:
HTML
<section data-role="page" id="start" data-enhance="false">
<div data-role="content">
<br>
<br>
<div align="right">
<a href="#" id="help" data-role="button">
<img src="./img/help-icon.png" style="margin-right: 11px;" />
</a>
</div>
<div align="center">
<img src="./img/Logo login screen.png" height="200" width="170" />
</div>
<br>
<br>
<form id="loginForm" align="center" data-ajax="false">
<div id="user" align="center">
<input class="amazeFont" type="text" id="accessKey" Placeholder="Access Key (20 characters)" size="30" maxlength="128" tabindex="1" autocomplete="on" autocorrect="off" autocapitalize="off" data-validation="[NOTEMPTY]" height="100" />
</div>
<br>
<br>
<div id="pass" align="center">
<input class="amazeFont" type="password" id="secretKey" Placeholder="Secret Key (40 characters)" size="30" maxlength="1024" autocomplete="on" tabindex="2" data-validation="[NOTEMPTY]" />
</div>
<br>
<br>
<center>
<button type="button" id="submitButton">Login</button>
</center>
</form>
</div>
</section>
JS
accKey = $("#accessKey").val();
secKey = $("#secretKey").val();
if (empty(accKey)) {
navigator.notification.alert(
"AccessKey and SecretKey Combination Incorrect or One of the fields is empty! Please check and Retry!",
function(){},
"Key Mismatch",
"Done");
//alert("AccessKey and SecretAccessKey fields are empty! Please enter values and Retry!");
$("#accessKey").focus();
} else {
if (empty(secKey)) {
navigator.notification.alert(
"AccessKey and SecretKey Combination Incorrect or One of the fields is empty! Please check and Retry!",
function(){},
"Key Mismatch",
"Done");
// alert("AccessKey and SecretAccessKey fields are empty! Please enter values and Retry!");
$("#accessKey").focus();
} else {
//DO SOMETHING;
}
}