jQuery的选择下一个文本字段中输入键按下

我已经使用jQuery做了一个网页，和负载它会自动选择第一个文本框。当按下ENTER键时，我希望它移动到下一个区域。jQuery的选择下一个文本字段中输入键按下

$('.barcodeField input').bind('keyup', function(event) { 
    if(event.keyCode==13){ 
     $("this + input").focus();  
    } 
});

我找不到任何工作在网上。我已经搜遍论坛。

来源

2011-01-10 Grant Unwin

有趣，因为我回答就是这样的一个问题:) http://stackoverflow.com/questions/4494552/change-enter-从提交到标签/ 4494691＃4494691。此外，我会反对这项建议，因为用户习惯于使用标签到另一个领域，而不是进入。 – 2011-01-10 17:34:19

**不要做**。 – zzzzBov 2011-01-10 19:00:06

是的我知道这是一个总的不是没有，当涉及到网页，但这是一个使用条形码扫描器的条码映射系统，写入到这种格式的屏幕“，”+条码+“ENTER” – 2011-01-11 11:36:54

你应该使用：

$(this).next('input').focus();

来源

2011-01-10 17:35:10 Sarfraz

基本上，你只需要上面有一些结构上的DOM元素，这样就可以选择下一个。我建议利用tabindex，但任何让你有明确订单的东西都可以工作。

来源

2011-01-10 17:36:15

我创建了一个小功能，可以做你的需要。这是我使用的版本，所以您可能需要更改类名，但您应该明白。

<script type="text/javascript"> 
$(document).ready(function(){ 
$(".vertical").keypress(function(event) { 
     if(event.keyCode == 13) { 
     textboxes = $("input.vertical"); 
     debugger; 
     currentBoxNumber = textboxes.index(this); 
     if (textboxes[currentBoxNumber + 1] != null) { 
      nextBox = textboxes[currentBoxNumber + 1] 
      nextBox.focus(); 
      nextBox.select(); 
      event.preventDefault(); 
      return false 
      } 
     } 
    }); 
}) 
</script>

所以基本上： -

获取所有的输入字段匹配.vertical
查找这是目前的文本框
查找下一个
将焦点设置在上一个

来源

2012-05-10 22:49:54

试试这个：

(function($){ 
    $.fn.enterNext = function(){ 
     var _i =0; 
     $('input[type=text], select',this) 
      .each(function(index){ 
      _i = index; 
      $(this) 
       .addClass('tab'+index) 
       .keydown(function(event){ 
        if(event.keyCode==13){ 
         $('.tab'+(index+1)).focus(); 
         event.preventDefault(); 
        } 
       }); 

     }) 
    $("input[type=submit]",this).addClass('tab'+(_i+1)); 
}})(jQuery);

使用：

$('form.element').enterNext();

于我而言，这是在我，因为函数的.next（）是严格要求自己的分支DOM元素外的最佳解决方案。最好的办法是给力的指数。

和我的英语不好对不起......

来源

2013-02-03 02:36:19 penacho123

这里是我想出了一个解决方案。我的问题是，我需要保持tabindex属性，即它必须发挥作用正是一样打标签。它使用下划线和jQuery。

我留在我的调试代码：

try { 
    var inputs = $("input[id^=tpVal-]"); 
    var sortedInputs = _.sortBy(inputs, function(element){ 
     var tabIndex = $(element).attr('tabindex');//debugging 
     var id = $(element).attr('id');//debugging 
     console.log(id +" | "+ tabIndex +" | "+ $(element));//debugging 
     return parseInt($(element).attr('tabindex')); 
    }); 
    $(sortedInputs).each(function (index, element) { 
     $(element).keyup(function(event){ 
      if(event.keyCode==13) { 
       var $thisElement = $(element);//debugging 
       var nextIndex = index+1;//debugging 
       var $nextElement = $(sortedInputs[nextIndex]); 
       var thisId = $thisElement.attr('id');//debugging 
       var nextId = $nextElement.attr('id');//debugging 
       console.log("Advance from "+thisId+" to "+nextId);//debugging 
       if($nextElement!=undefined) { 
        $(sortedInputs[index + 1]).focus(); 
       } 
      } 
     }); 
    }); 
} catch (e) { 
    console.log(e); 
}

来源

2014-10-02 17:42:24

<!DOCTYPE html> 

<html> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

    </head> 
    <body> 
     <input id="122" class='TabOnEnter' tabindex="1" /><br> 
     <input id="123" class='TabOnEnter' tabindex="2" /><br> 

     <input type="text" name="abc" /><br> 
      <input type="text" name="abc1" /><br> 
      <input type="text" name="abc2" /><br> 
      <input type="text" name="abc3" class='TabOnEnter' tabindex="3" /><br> 

     <input class='TabOnEnter' tabindex="4" /><br> 
     <input class='TabOnEnter' tabindex="5" /><br> 
     <input class='TabOnEnter' tabindex="6" /><br> 
<!--  <textarea class='TabOnEnter' tabindex="6">Hi, I am a test area</textarea>--> 
     <input type="submit" value="submit" class='TabOnEnter' tabindex="7"> 


     <script src="//code.jquery.com/jquery-2.1.1.min.js"></script> 
     <script> 
      $(document).on("keypress", ".TabOnEnter", function (e) 
      { 
       //Only do something when the user presses enter 
       if (e.keyCode == 13) 
       { 
        var nextElement = $('[tabindex="' + (this.tabIndex + 1) + '"]'); 
        console.log(this, nextElement); 
        if (nextElement.length) 
         nextElement.focus() 
        else 
         $('[tabindex="1"]').focus(); 
       } 
      }); 

//Hidden inputs should get their tabindex fixed, not in scope ;) 
//$(function(){ $('input[tabindex="4"]').fadeOut(); }) 
     </script> 
    </body> 
</html>

来源

2016-05-20 13:06:57 Hrushi

jQuery的选择下一个文本字段中输入键按下

回答

相关问题