Question

我有4个输入字段。

我试图强制用户在每个输入字段输入1个字符，一旦输入1个字符，就需要在下一个字段中输入下一个字符，直到输入结束。

然而，我现在的代码已经到处都是，我无法弄清楚我需要做些什么来实现这个目标。

这是我的代码：

while ($data = $results->fetch_assoc()){
    if ($data['descriptionPub']) {
        $description = $data['description'];
    } else {
        $description = '';
    }
    $valueMap[] = array(
      'title' => $data['title'],
      'lat' => $data['lat'],
      'lng' => $data['lng'],
      'description' => $description,
      'descriptionPub' => $data['descriptionPub']
    );
}

如果您在第一个字段中输入内容，它将跳转到下一个字段，但之后它会变得混乱。

有人可以就此问题提出建议吗？

Answer 1

您需要尝试on input侦听器来检测输入中的更改而不是keyup，因为您需要确保在更改焦点之前输入字符。

$(document).on('input', '.inps', function (event) {
   // check for hyphen
	var myLength = $(this).val().trim().length;
  if(myLength ==1){
    $(this).next('.inps').focus();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="inps" >
<input type="text" class="inps" >
<input type="text" class="inps" >
<input type="text" class="inps" >

Answer 2

您可以将myLength值与1进行比较，如下面的代码段所示：

＆＃13;

$('.inps').keydown(function (event) {
    // check for hyphen
var myLength = $(this).val().length;

if(myLength ==1){
$(this).next('.inps').focus();
}


});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="inps" >
<input type="text" class="inps" >
<input type="text" class="inps" >
<input type="text" class="inps" >

＆＃13;

Jquery：优雅地将光标强制插入下一个输入字段？

2 个答案: