如何在javascript或jQuery的ENTER按键模拟TAB

Question

我想更改keydown中的键码（按键）在页面的所有输入中。我想用TAB键码替换回车键码。我如何做到这一点？

感谢

---

EDIT 1）

考虑以下代码：

<div> 
    <asp:RadioButtonList ID="RadioButtonList1" runat="server"> 
     <asp:ListItem>1</asp:ListItem> 
     <asp:ListItem>2</asp:ListItem> 
     <asp:ListItem>3</asp:ListItem> 
     <asp:ListItem>4</asp:ListItem> 
    </asp:RadioButtonList> 
    <br /> 
    <br /> 
    <asp:TextBox ID="TextBox1" runat="server">3333</asp:TextBox> 
    <br /> 
    <br /> 
    <asp:DropDownList ID="DropDownList1" runat="server"> 
     <asp:ListItem>1</asp:ListItem> 
     <asp:ListItem>2</asp:ListItem> 
     <asp:ListItem>3</asp:ListItem> 
    </asp:DropDownList> 
</div> 

我想，当用户按下Enter键上的上述控制重点ENY进入下一控制。

感谢

Answer 1

我觉得这个工作：

$('input').live("keypress", function (e) { 
     /* ENTER PRESSED*/ 
     var OffSet = 0; 
     if (e.keyCode == 13) { 
      /* FOCUS ELEMENT */ 
      if ($(this).is("input[type='radio']")) { 
       var tblID = $(this).closest('table').attr('id'); 
       var radios = $('#' + tblID).find(":input"); 
       //alert(radios.index(this)); 
       OffSet = radios.length - radios.index(this) - 1; 
      } 
      //alert(OffSet); 

      var inputs = $(this).parents("form").eq(0).find(":input"); 
      var idx = inputs.index(this); 
      inputs[idx + OffSet].blur(); 

      try { 
       inputs[idx + OffSet].selectionStart = inputs[idx + OffSet].selectionEnd = -1; 
      } catch (e) { 

      } 
      if (idx == inputs.length - 1) { 
       inputs[0].select(); 
      } else { 
       inputs[idx + 1 + OffSet].focus(); // handles submit buttons 
       try { 
        inputs[idx + 1 + OffSet].select(); 
       } catch (e) { 
       } 
      } 
      return false; 
     } 
    }); 

Answer 2

希望这个作品

$('input,textarea').keydown(function(){ 
    if(event.keyCode==13) { 
    event.keyCode = 9; 
    } 
}); 

编辑

试试这个http://jsfiddle.net/GUmUg/。玩弄选择，使这项工作，因为我不知道ASP

$('input,textarea').keypress(function(e){ 
    if(e.keyCode==13) { 
    $(this).next().focus(); 
    } 
}); 

Answer 3

此代码来替换制表符输入：

$("#wmd-input").bind("keypress", function(e) { 
    if (e.keyCode == 13) { 
     var input = $(this); 
     var inputVal = input.val(); 
     setTimeout(function() { 
     input.val(inputVal.substring(0,inputVal.length) + "\t"); 
     }, 1); 
    } 
}); 

Live Demo

UPDATE：

此代码重点关注下一个元素：

$(document).ready(function() { 
    $("input,select").bind("keydown", function (e) { 
     if (e.keyCode == 13) { 
      var allInputs = $("input,select"); 
      for (var i = 0; i < allInputs.length; i++) { 
       if (allInputs[i] == this) { 
        while ((allInputs[i]).name == (allInputs[i + 1]).name) { 
         i++; 
        } 

        if ((i + 1) < allInputs.length) $(allInputs[i + 1]).focus(); 
       } 
      } 
     } 
    }); 
}); 

Answer 4

$('input').on('keydown',function(e){ 
    var keyCode = e.keyCode || e.which; 
    if(e.keyCode === 13) { 
     e.preventDefault(); 
     $('input')[$('input').index(this)+1].focus(); 
     } 
}); 

检查小提琴这里：http://jsfiddle.net/Pd5QC/

Answer 5

我也曾有过类似的问题，在这里我想按+的数字键盘，以标签到下一个领域。现在我已经发布了一个我认为会帮助你的图书馆。

PlusAsTab：一个jQuery插件，将numpad plus键用作tab键等价物。

既然你想进入/↵相反，你可以设置的选项。找出您想要与jQuery event.which demo一起使用的密钥。

JoelPurra.PlusAsTab.setOptions({ 
    // Use enter instead of plus 
    // Number 13 found through demo at 
    // https://api.jquery.com/event.which/ 
    key: 13 
}); 

然后通过添加plus-as-tab="true"您要使用输入，如标签中，或者包含这些表单域的一些其他元素的表单字段启用该功能。单选按钮不应该是个问题，因为它们被我的其他库EmulateTab覆盖 - 请参阅autonavigation of radio buttons in that demo。

<div plus-as-tab="true"> 
    <!-- all focusable elements inside the <div> will be enabled --> 
    <asp:RadioButtonList ID="RadioButtonList1" runat="server"> 
    <!-- Radio buttons should not be a problem. --> 
    </asp:RadioButtonList> 
</div> 

您可以在PlusAsTab enter as tab demo中自己尝试一下。

Answer 6

我这样做的方式是通过对每个选择使用jquery并关注当前对象之后的元素。

$(document).on('keyup', '.my-input', function (ev) { 

    if (ev.keyCode == '13') { 
     var currentInput = this; 
     var isOnCurrent = false; 

     $('.my-input').each(function() { 

      if (isOnCurrent == true) { 
       $(this).focus(); 
       return false; 
      } 

      if (this == currentInput) { 
       isOnCurrent = true; 
      } 

     }); 
    } 
}); 

Answer 7

我创建了一个simple jQuery plugin这确实解决了这个问题。它使用jQuery UI的'：tabbable'选择器来查找下一个'tabbable'元素并选择它。

用法示例：

// Simulate tab key when enter is pressed   
$('.myElement').bind('keypress', function(event){ 
    if(event.which === 13){ 
     if(event.shiftKey){ 
      $.tabPrev(); 
     } 
     else{ 
      $.tabNext(); 
     } 
     return false; 
    } 
}); 

Answer 8

$(document).ready(function() { 

//Objetos con CssClass="EntTab" sustituye el Enter (keycode 13) por un Tabulador (keycode 9)!! 

    $(".EntTab").bind("keypress", function(e) { 
     if (e.keyCode == 13) { 
      var inps = $("input, select"); //add select too 
      for (var x = 0; x < inps.length; x++) { 
       if (inps[x] == this) { 
        while ((inps[x]).name == (inps[x + 1]).name) { 
         x++; 
        } 
        if ((x + 1) < inps.length) $(inps[x + 1]).focus(); 
       } 
      } e.preventDefault(); 
     } 
    }); 
});