0

我试图让我的输入文本字段在键入时集中在下一行。

jQuery代码：

for (var counter = 0; counter < 4; counter++) {
    $("<input>", {
        "class":"anBox",
        size: 1,
        maxlength: 1
    }).appendTo('#answerLine_' + counter);
};
$(".anBox").keyup(function () {
    if (this.value.length == this.maxLength) {
      $(this).next('.anBox').focus();
    }
});

这是一个：jsfiddle

4

4 回答 4

4

你的用法.next()不正确。该.next()函数查找当前集合中元素的下一个兄弟元素，还可以选择检查下一个兄弟元素是否与提供的选择器匹配。

但是，您的<input>元素位于不同的<span>元素中，因此它们不是兄弟姐妹，因此无法使用.next().

你需要做的是从你当前的<input>( $(this)) 到它的父元素 ( .parent())，到下一个<span>元素 ( .next()or .next('span'))，然后找到.anBox那个 ( ) 里面的元素.find('.anBox')，然后聚焦它 ( .focus())。看起来像这样：

$(this).parent().next().find('.anBox').focus();

看看更新的 jsFiddle 演示。

于 2013-04-18T12:51:38.947 回答
1

您对 .next() 的使用不正确。尝试使用

$(this).parent().next('span').find('.anBox').focus();
于 2013-04-18T12:52:45.183 回答
0

因为.anBox没有“下一个”。接下来.anBox是另一个跨度。你必须爬上一个父跨度，然后去下一个跨度，并在.anBox那里找到一个：

if (this.value.length == this.maxLength) {
  $(this).parent().next().find('.anBox').focus();
}

此外，您正在比较maxLength脚本中哪个始终为“1”。仅当您按下“1”时，您的下一个输入框才会聚焦

于 2013-04-18T12:52:45.470 回答
0

next()不会为您提供 DOM 中的下一个匹配元素。它只给你下一个兄弟，如果它匹配你作为选择器传递的内容。

为了得到你想要的，你可以使用nextInDOM()实用程序（免责声明：我是作者）并像这样使用它：

$(this).nextInDOM('.anBox').focus();

于 2013-04-18T12:56:12.587 回答