Question

我目前正在使用html5自动对焦作为登录表单。我正在寻找一个功能，只有在空的情况下才会自动对焦用户名文本框，如果不为空，则自动对焦于下一个文本框。

Answer 1

使用下面的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>

它不适用于您的情况的原因是因为您没有名为“name”的属性。我想你可能应该阅读jQuery selector来了解原因。如果你使用ID，那么你就是这样做的。

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

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

Answer 2

在页面中搜索输入字段，并强制将焦点放在第一个空字段上。我们可能希望将字段限制为给定的形式，并且可能还添加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;
    }
}

仅当值为空时才关注文本框

2 个答案: