专注于下面的文本框，而不是相邻的使用jQuery

Question

我想专注于彼此下方的文本框。在编写了用作选项卡的enter查询之后，焦点不是相邻的下一个文本框。但是我想关注彼此下方的文本框。是我使用的查询。

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
  $('input:text:first').focus();
    var $inp=$('.cls');

    $inp.bind('keydown',function (e) {
    var key = e.which;
    if(key == 13) {
    e.preventDefault();

    var nxtIdx = $inp.index(this) + 1;
    $(".cls:eq(" + nxtIdx + ")").focus();
    }
    });
    });

.cls是用于各种文本框的类名。请提供帮助。谢谢。

Answer 1

$(".input:text:first").keydown(function (e) {

   var key = e.which;
    if(key == 13) {
      e.preventDefault();
      $(this).next('.cls').focus();
    }
    });

});

可能此功能对您有用。

Answer 2

检查这是否对您有帮助。 如果我们没有足够的HTML信息，我们将无法为您提供更多帮助。

 $(document).ready(function() { $('input:text:first').focus(); $(".cls").keydown(function (e) { if(e.which == 13) { e.preventDefault(); $(this).next('.cls').focus(); } }); }); 

 <input type='text' class='cls'> <input type='text' class='cls'> <input type='text' class='cls'> <input type='text' class='cls'> <input type='text' class='cls'> 

Answer 3

尝试这个：

$(document).ready(function() {
        $(".ele").on("keyup", function(e) {
            if (e.which == 13 || e.keyCode == 13) {
                var ele = $(this);
                var nextAll = ele.nextAll(".ele");
                var next = nextAll.filter(function() {
                    return (ele.offset().top != $(this).offset().top)
                });
                next.eq(0).focus();
                return false;
            }
        });

    });

HTML：

    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>
    <textarea class="ele" placeholder="Sample textarea"></textarea>

演示： http ： //jsfiddle.net/lotusgodkk/86n05y2c/2/

要对其进行测试，请尝试调整jsfiddle布局的大小。

说明：根据您的要求，您需要关注当前文本框下方的文本框，即当前文本框和下一个文本框的顶部偏移不应相同。 这是工作的基本条件。 为了使其更加具体，您还可以进一步添加左右偏移量的条件。