使用回车键按下表格中的下一个输入字段

时间:2014-01-20 17:23:53

标签: jquery

我需要使用回车键按下移动到包含多行的表中的下一个输入字段。我试试这个:

$(function() {

    $('input').keyup(function (e) {
       if (e.which == 13) {
       $(this).find().next('input').focus();
       }
     });

});

为什么不工作? :(

HTML

<table class="half">
  <tr>
  <td>Nome :</td>
  <td><input name="ragsoc" type="text" id="ragsoc" value=""/></td>
  <td>Mnemo:</td>
  <td><input name="mnemo" type="text" id="mnemo" value=""/></td>
  <td>Partita IVA :</td>
  <td><input name="piva" type="text" id="piva" value=""/></td>
  </tr>
  <tr>
  <td>Nome :</td>
  <td><input name="ragsoc" type="text" id="ragsoc" value=""/></td>
  <td>Mnemo:</td>
  <td><input name="mnemo" type="text" id="mnemo" value=""/></td>
  <td>Partita IVA :</td>
  <td><input name="piva" type="text" id="piva" value=""/></td>
  </tr>
 </table>

此代码可以正常工作,但仅限于表的第一行:

$('input').keydown(function (e) {
    if (e.which === 13) {
    $(this).closest('td').nextAll().eq(1).find('input').focus()
    }
 });

有什么问题或缺失?

4 个答案:

答案 0 :(得分:15)

假设.inputs是您当前元素的兄弟。 .find()搜索当前元素的后代(this)

 $('.inputs').keydown(function (e) {
    if (e.which === 13) {
       $(this).next('.inputs').focus();
    }
 });

您需要使用.closest().nextAll()

 $('.inputs').keydown(function (e) {
    if (e.which === 13) {
        $(this).closest('td').nextAll().eq(1).find('.inputs').focus();

        //OR
        //$(this).closest('td').next().next().find('.inputs').focus()
    }
 });

DEMO

OP已更新问题。使用

 $('.inputs').keydown(function (e) {
     if (e.which === 13) {
         var index = $('.inputs').index(this) + 1;
         $('.inputs').eq(index).focus();
     }
 });

DEMO,注意我使用了class="inputs"

答案 1 :(得分:0)

可能它不起作用,因为您没有使用find()方法的任何参数。

试试这个:

$('#txt').keydown(function (e){
   if(e.keyCode == 13){
     $(this).next('.inputs').focus();
   }
});

或者这个:

$('#txt').keydown(function (e){
   if(e.keyCode == 13){
     $(this).find('.inputs').focus();
   }
});

这些可行!

答案 2 :(得分:0)

 $('.inputs').keydown(function (e){
   if(e.keyCode == 13){
     $(this).next('.inputs').focus();
 }
});

答案 3 :(得分:0)

是:

if (event.which == 13) {
    event.preventDefault();
    var $this = $(event.target);
    var index = parseFloat($this.attr('data-index'));
    $('[data-index="' + (index + 1).toString() + '"]').focus();
}

http://jsfiddle.net/hxZSU/1/

字体:

focusing on next input (jquery)