Question

false

以此部分为例。有两个文本框（页面上的任何位置）。当用户按下Enter键时，我正在尝试将焦点从第一个输入设置到下一个输入。我如何在JQuery中实现这一目标？

Answer 1

您可以使用jQuery的.keypress事件。

<强> HTML

<div>
  <table><tr><td><input type="text" id="first" autofocus/></td></tr></table>
</div>
<div>
  <table><tr><td><input type="text" id="second"/></td></tr></table>
</div>

jQuery阻止

$(document).ready(function(){

    $('#first').keypress(function(e){
    if(e.keyCode ==13)
    {
      $('#second').focus();
    }
  })
});

工作演示：https://jsfiddle.net/ne403qyb/

希望这有帮助！

Answer 2

＆＃13;

$(document).ready(function() {

  $('input[type=text]').keypress(function(e) {
      if (e.keyCode == 13) {

        if ($(this).attr('class') === "last") {
          $('input[type=text]').eq(0).focus()
        } else {

          $('input[type=text]').closest('input[type=text]').focus();
        }
      }
    });
});

＆＃13;

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

＆＃13;

Answer 3

 $(document).on("keydown", "#Textbox1", function(e) {
      var keyCode = e.keyCode || e.which; 
      if (keyCode == 13) {                       
        e.preventDefault(); 
        $("#Textbox2").focus();
      }
    });

Woking Fiddle

Answer 4

试试这个：）

$.ajax({
    ...
    data : formData,
    ...
});

$(document).keypress(function(e) {
    if(e.which == 13) {
        var focusElem = document.activeElement;
        var nextInput = $(focusElem).next().attr('id');
        $("#" + nextInput).focus();
    }
});

Answer 5

试试这个会帮到你

$(document).ready(function() {
  $('input').on("keypress", function(e) {

    if (e.which == 13) {
      var tab = $(this).attr("tabindex") + 1
      $("input[tabindex=" + tab + "]").focus();
    }
  });


});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div>
  <table>
    <tr>
      <td>
        <input type="text" tabindex="1" />
      </td>
    </tr>
  </table>
</div>
<div>
  <table>
    <tr>
      <td>
        <input type="text" tabindex="2" />
      </td>
    </tr>
  </table>
</div>

Answer 6

您可以为所有输入元素提供一个类（如果文档中没有您不想要焦点的输入类型文本元素，则可以通过输入文本标记执行相同操作）并且可以找到下一个输入元素具有相同的类。

$(".test").keypress(function(e) {
    var inputs = $(".test");
    if(e.which == 13) {   
    var $next = inputs.filter(":gt(" + inputs.index(this) + ")").first();
    $next.focus();
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <table><tr><td><input class ="test"type="text"/></td></tr></table>
</div>
<div>
  <table><tr><td><input class="test" type="text"/></td></tr></table>
</div>
<div>
  <table><tr><td><input class="test" type="text"/></td></tr></table>
</div>
<div>
  <table><tr><td><input class="test" type="text"/></td></tr></table>
</div>

Answer 7

您可以尝试其他替代方式jsfiddle，

HTML：

<div>
  <table><tr><td><input type="text" class='inputs'/></td></tr></table>
</div>
<div>
  <table><tr><td><input type="text" class='inputs'/></td></tr></table>
</div>

JS：

$(document).on("input", "input", function(e){
   if(e.which == 13){
       $(this).next('.inputs').focus();
   }
});

将重点放在页面上任何位置的下一个输入元素上

7 个答案: