0

我目前正在将 html5 自动对焦用于登录表单。我正在寻找一个函数，它只会在用户名文本框为空时自动聚焦，如果不为空则自动聚焦在下一个文本框上。

4

2 回答 2

3

使用下面的 HTML

<input name="username" value="a" autofocus="autofocus">
<input name="password" type="password">​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

你可以用 jQuery 做这样的事情

var $username = $('[name="username"]');
var $password = $('[name="password"]');
if($username.val()​​​​​​​​​​​​​​​​​​​​​.trim().length > 0){
    $password.focus();
}​

应该就是这么简单。确保 Javascript 位于页面底部，或者您可以使用 $(document).ready() 函数确保在呈现 HTML 后运行 Javascript。

基于附加信息的更多详细信息

<asp:TextBox ID="UserName" runat="server" autofocus="true" required="true"></asp:TextBox>

它不适用于您的情况的原因是因为您没有名为“名称”的属性。我认为您可能应该阅读一些有关jQuery 选择器的信息以了解原因。如果您使用 ID，那么您就是这样做的。

var $username = $('#UserName');
var $password = $('#password');
if($username.val()​​​​​​​​​​​​​​​​​​​​​.trim().length > 0){
    $password.focus();
}​

当然，您现在必须匹配密码选择器，以便它实际上会选择密码输入来设置焦点。

于 2012-11-07T03:49:46.363 回答
1

在页面中搜索输入字段，并强制将焦点放在第一个空字段上。我们可能希望将字段限制为给定的表单，并且可能还添加 textareas - 不过我会把它留给你 - 没什么太难的。

var inputs = document.getElementsByTagName('input'),
    i = -1, I = inputs.length,
    curr;

for (; ++i < I;) {
    curr = inputs[i];
    if ( !curr.value.length ) {
        curr.focus();
        break;
    }
}​
于 2012-11-07T03:57:55.577 回答