以html形式输入key hook
我在 HTML 中实现了表单:
<form id="loginForm" action="/?do=login" method="post" >
<table width="50%" border="0">
<tr>
<td colspan="2">
<span id="LoginErr"></span>
<div>Login:</div>
<input id="Login" type="text" maxlength="32" name="Login" value="{VAR %LOGIN}"/>
</td>
</tr>
<tr>
<td valign="bottom">
<span id="PasswordErr"></span>
<div>Passoword:</small></div>
<input id="Password" type="password" maxlength="128" name="Password" value=""/>
</td>
</tr>
<tr>
<td>
<a href="javascript:checkLogin()">Enter</a>
</td>
</tr>
</table>
</form>
这是检查和发布功能(使用 jQuery):
function checkLogin()
{
var focused = false;
function report_error(field, err)
{
$('#' + field + 'Err').html(err);
if (!focused)
{
$('#' + field).focus();
focused = true;
}
}
$('#LoginErr').html('');
$('#PasswordErr').html('');
$login = jQuery.trim($('#Login').val());
$password = jQuery.trim($('#Password').val());
if ($login.length == 0)
report_error('Login', 'The login field is empty!');
if ($password.length == 0)
report_error('Password', 'The password field is empty!');
if (!focused)
$('#loginForm').submit();
}
但是我在使用 Enter 键时遇到了问题。当我按下此键时,表单将在没有我的 javascript 检查的情况下发布。 当按下回车键并且不再执行任何操作时,我需要调用我的函数。
谢谢!
更新: 正确的代码是: 在表单标签中需要添加:onSubmit="return checkLogin()
在 javascript 中 if (!focused) $('#loginForm').submit();
需要在 return !focused;
时进行更改 感谢拉丹博斯基。
I implemented form in HTML:
<form id="loginForm" action="/?do=login" method="post" >
<table width="50%" border="0">
<tr>
<td colspan="2">
<span id="LoginErr"></span>
<div>Login:</div>
<input id="Login" type="text" maxlength="32" name="Login" value="{VAR %LOGIN}"/>
</td>
</tr>
<tr>
<td valign="bottom">
<span id="PasswordErr"></span>
<div>Passoword:</small></div>
<input id="Password" type="password" maxlength="128" name="Password" value=""/>
</td>
</tr>
<tr>
<td>
<a href="javascript:checkLogin()">Enter</a>
</td>
</tr>
</table>
</form>
This is the check and post function (using jQuery):
function checkLogin()
{
var focused = false;
function report_error(field, err)
{
$('#' + field + 'Err').html(err);
if (!focused)
{
$('#' + field).focus();
focused = true;
}
}
$('#LoginErr').html('');
$('#PasswordErr').html('');
$login = jQuery.trim($('#Login').val());
$password = jQuery.trim($('#Password').val());
if ($login.length == 0)
report_error('Login', 'The login field is empty!');
if ($password.length == 0)
report_error('Password', 'The password field is empty!');
if (!focused)
$('#loginForm').submit();
}
But I have trouble with enter key. When i press this key form is posted without my javascript check.
I need call my function when enter key is pressed and no more action.
Thanx!
Update:
Correct code is:
in form tag need add: onSubmit="return checkLogin()
in javascript if (!focused) $('#loginForm').submit();
need change on return !focused;
Thanks to rdamborsky.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
使用
onSubmit
表单事件:它将在表单数据实际发送之前调用,无论触发提交事件(单击按钮,在字段之一中按 Enter 键...)
use
onSubmit
form event:It will be called just before your form's data are actually sent whatever triggers the submit event (click on button, pressing enter within one of fields...)