我想要一个jquery解决方案，我必须接近，需要做什么？
$('html').bind('keypress', function(e)
{
if(e.keyCode == 13)
{
return e.keyCode = 9; //set event key to tab
}
});
我可以返回false并且它阻止按下回车键，我想我可以将keyCode更改为9以使其成为选项卡，但它似乎不起作用。我必须接近，发生了什么事？
答案 0 :(得分：64)
$('input').on("keypress", function(e) {
/* ENTER PRESSED*/
if (e.keyCode == 13) {
/* FOCUS ELEMENT */
var inputs = $(this).parents("form").eq(0).find(":input");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
inputs[0].select()
} else {
inputs[idx + 1].focus(); // handles submit buttons
inputs[idx + 1].select();
}
return false;
}
});
答案 1 :(得分：31)
这很完美！
$('input').keydown( function(e) {
var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
if(key == 13) {
e.preventDefault();
var inputs = $(this).closest('form').find(':input:visible');
inputs.eq( inputs.index(this)+ 1 ).focus();
}
});
答案 2 :(得分：8)
为什么不这么简单？
$(document).on('keypress', 'input', function(e) {
if(e.keyCode == 13 && e.target.type !== 'submit') {
e.preventDefault();
return $(e.target).blur().focus();
}
});
这样，除非你专注于“提交”的输入类型，否则你不会触发提交，它会让你正确地离开。这也使它适用于动态添加到页面的输入。
注意：对于任何可能有“on blur”事件侦听器的人来说，blur（）位于焦点（）的前面。该过程没有必要起作用。
答案 3 :(得分：7)
PlusAsTab：一个jQuery插件，使用numpad plus键作为等效的tab键。
PlusAsTab也是configurable to use the enter key as in this demo。请参阅some of my older answers to this question。
在您的情况下，将整个页面的选项卡功能替换为输入键（在选项中将输入键设置为选项卡后）。
<body data-plus-as-tab="true">
...
</body>
答案 4 :(得分：5)
从Ben的插件构建此版本处理select，您可以将选项传递给allowSubmit。即。 $("#form").enterAsTab({ 'allowSubmit': true});如果提交按钮正在处理事件，这将允许输入提交表单。
(function( $ ){
$.fn.enterAsTab = function( options ) {
var settings = $.extend( {
'allowSubmit': false
}, options);
this.find('input, select').live("keypress", {localSettings: settings}, function(event) {
if (settings.allowSubmit) {
var type = $(this).attr("type");
if (type == "submit") {
return true;
}
}
if (event.keyCode == 13 ) {
var inputs = $(this).parents("form").eq(0).find(":input:visible:not(disabled):not([readonly])");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
idx = -1;
} else {
inputs[idx + 1].focus(); // handles submit buttons
}
try {
inputs[idx + 1].select();
}
catch(err) {
// handle objects not offering select
}
return false;
}
});
return this;
};
})( jQuery );
答案 5 :(得分：4)
这终究是对我有用的东西。我正在使用jqeasyui并且工作正常
$(document).on('keyup', 'input', function(e) {
if(e.keyCode == 13 && e.target.type !== 'submit') {
var inputs = $(e.target).parents("form").eq(0).find(":input:visible"),
idx = inputs.index(e.target);
if (idx == inputs.length - 1) {
inputs[0].select()
} else {
inputs[idx + 1].focus();
inputs[idx + 1].select();
}
}
});
答案 6 :(得分：3)
我从接受的答案中编写了代码作为jQuery插件，我发现它更有用。 （此外，它现在忽略隐藏，禁用和只读形式元素）。
$.fn.enterAsTab = function () {
$(this).find('input').live("keypress", function(e) {
/* ENTER PRESSED*/
if (e.keyCode == 13) {
/* FOCUS ELEMENT */
var inputs = $(this).parents("form").eq(0).find(":input:visible:not(disabled):not([readonly])"),
idx = inputs.index(this);
if (idx == inputs.length - 1) {
inputs[0].select()
} else {
inputs[idx + 1].focus(); // handles submit buttons
inputs[idx + 1].select();
}
return false;
}
});
return this;
};
这样我可以做$（'＃form-id'）。enterAsTab（）; ...想想我发布的帖子，因为还没有人把它作为$插件发布，而且写作并不完全直观。
答案 7 :(得分：3)
包括所有类型的输入
$(':input').keydown(function (e) {
var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
if (key == 13) {
e.preventDefault();
var inputs = $(this).closest('form').find(':input:visible:enabled');
if ((inputs.length-1) == inputs.index(this))
$(':input:enabled:visible:first').focus();
else
inputs.eq(inputs.index(this) + 1).focus();
}
});
答案 8 :(得分：2)
这是我的解决方案，欢迎反馈.. :)
$('input').keydown( function (event) { //event==Keyevent
if(event.which == 13) {
var inputs = $(this).closest('form').find(':input:visible');
inputs.eq( inputs.index(this)+ 1 ).focus();
event.preventDefault(); //Disable standard Enterkey action
}
// event.preventDefault(); <- Disable all keys action
});
答案 9 :(得分：2)
我充分利用了上述内容，并添加了处理表单之外的任何输入的功能。此外，如果您到达最后一个输入，它还会正确地循环回来。如果只有一个输入，它会模糊，然后重新聚焦单个输入以触发任何外部模糊/焦点处理程序。
$('input,select').keydown( function(e) {
var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
if(key == 13) {
e.preventDefault();
var inputs = $('#content').find(':input:visible');
var nextinput = 0;
if (inputs.index(this) < (inputs.length-1)) {
nextinput = inputs.index(this)+1;
}
if (inputs.length==1) {
$(this).blur().focus();
} else {
inputs.eq(nextinput).focus();
}
}
});
答案 10 :(得分：2)
以下是我一直在使用的内容：
$("[tabindex]").addClass("TabOnEnter");
$(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();
}
});
关注tabindex ，并非特定于表单，而是整页。
注意 live已被jQuery淘汰，现在您应该使用on
答案 11 :(得分：1)
这些解决方案不适用于我的数据网格。我希望他们愿意。我真的不需要Tab或Enter来移动到下一个输入，列，行或其他任何东西。我只需要Enter来触发.focusout或.change，我的datagrid就会更新数据库。所以我将“输入”类添加到相关的文本输入中，这对我来说很有用：
$(function() {
if ($.browser.mozilla) {
$(".enter").keypress(checkForEnter);
} else {
$(".enter").keydown(checkForEnter);
}
});
function checkForEnter(event) {
if (event.keyCode == 13) {
$(".enter").blur();
}
}
答案 12 :(得分：0)
我仅需要输入和选择内容，元素必须是可聚焦的。这个脚本对我来说更好：
$('body').on('keydown', 'input, select', function(e) {
if (e.key === "Enter") {
var self = $(this), form = self.parents('form:eq(0)'), focusable, next;
focusable = form.find('input,select,textarea').filter(':visible');
next = focusable.eq(focusable.index(this)+1);
if (next.length) {
next.focus();
} else {
form.submit();
}
return false;
}
});
也许可以帮助某人。
答案 13 :(得分：0)
我知道这是相当古老的，但我正在寻找相同的答案，并发现所选择的解决方案不遵守tabIndex。因此，我将其修改为以下适用于我的内容。请注意，maxTabNumber是一个全局变量，它包含最大可列表输入字段数
@XmlAttribute(name = "asd:resource")
private String asdResource;
答案 14 :(得分：0)
我在开发过程中有同样的要求所以我对此进行了研究。在过去的两天里，我阅读了很多文章并尝试了很多解决方案，比如jQuery.tabNext（）插件。
我在IE11上遇到了一些麻烦（所有的IE版本都有这个bug）。当输入文本后跟非文本输入时，未清除选择。所以我基于@Sarfraz解决方案建议创建了我自己的tabNext（）方法。我也在思考它应该如何表现（只有当前形式的圆形或者可能通过完整的文档）。我仍然没有照顾tabindex属性，主要是因为我偶尔使用它。但我不会忘记它。
为了让我的贡献对每个人都有用，我在这里创建了jsfiddle示例https://jsfiddle.net/mkrivan/hohx4nes/
我还在这里包含了示例的JavaScript部分：
function clearSelection() {
if (document.getSelection) { // for all new browsers (IE9+, Chrome, Firefox)
document.getSelection().removeAllRanges();
document.getSelection().addRange(document.createRange());
console.log("document.getSelection");
} else if (window.getSelection) { // equals with the document.getSelection (MSDN info)
if (window.getSelection().removeAllRanges) { // for all new browsers (IE9+, Chrome, Firefox)
window.getSelection().removeAllRanges();
window.getSelection().addRange(document.createRange());
console.log("window.getSelection.removeAllRanges");
} else if (window.getSelection().empty) { // maybe for old Chrome
window.getSelection().empty();
console.log("window.getSelection.empty");
}
} else if (document.selection) { // IE8- deprecated
document.selection.empty();
console.log("document.selection.empty");
}
}
function focusNextInputElement(node) { // instead of jQuery.tabNext();
// TODO: take the tabindex into account if defined
if (node !== null) {
// stay in the current form
var inputs = $(node).parents("form").eq(0).find(":input:visible:not([disabled]):not([readonly])");
// if you want through the full document (as TAB key is working)
// var inputs = $(document).find(":input:visible:not([disabled]):not([readonly])");
var idx = inputs.index(node) + 1; // next input element index
if (idx === inputs.length) { // at the end start with the first one
idx = 0;
}
var nextInputElement = inputs[idx];
nextInputElement.focus(); // handles submit buttons
try { // if next input element does not support select()
nextInputElement.select();
} catch (e) {
}
}
}
function tabNext() {
var currentActiveNode = document.activeElement;
clearSelection();
focusNextInputElement(currentActiveNode);
}
function stopReturnKey(e) {
var e = (e) ? e : ((event) ? event : null);
if (e !== null) {
var node = (e.target) ? e.target : ((e.srcElement) ? e.srcElement : null);
if (node !== null) {
var requiredNode = $(node).is(':input')
// && !$(node).is(':input[button]')
// && !$(node).is(':input[type="submit"]')
&& !$(node).is('textarea');
// console.log('event key code ' + e.keyCode + '; required node ' + requiredNode);
if ((e.keyCode === 13) && requiredNode) {
try {
tabNext();
// clearSelection();
// focusNextInputElement(node);
// jQuery.tabNext();
console.log("success");
} catch (e) {
console.log("error");
}
return false;
}
}
}
}
document.onkeydown = stopReturnKey;
我也留下了评论行，所以可以遵循我的想法。
答案 15 :(得分：0)
您应该过滤所有禁用和只读元素。 我认为这段代码不应该包含按钮
$('body').on('keydown', 'input, select, textarea', function(e) {
var self = $(this),
form = self.parents('form:eq(0)'),
submit = (self.attr('type') == 'submit' || self.attr('type') == 'button'),
focusable,
next;
if (e.keyCode == 13 && !submit) {
focusable = form.find('input,a,select,button,textarea').filter(':visible:not([readonly]):not([disabled])');
next = focusable.eq(focusable.index(this)+1);
if (next.length) {
next.focus();
} else {
form.submit();
}
return false;
}
});
答案 16 :(得分：0)
我知道这个问题比上帝年长，但我从来没有看到过那么优雅的答案。
doc.on('keydown', 'input', function(e, ui) {
if(e.keyCode === 13){
e.preventDefault();
$(this).nextAll('input:visible').eq(0).focus();
}
});
似乎可以尽可能少地完成工作。
答案 17 :(得分：0)
$('input').live("keypress", function(e) {
/* ENTER PRESSED*/
if (e.keyCode == 13) {
/* FOCUS ELEMENT */
var inputs = $(this).parents("form").eq(0).find(":input:visible");
var idx = inputs.index(this);
if (idx == inputs.length - 1) {
inputs[0].select()
} else {
inputs[idx + 1].focus(); // handles submit buttons
inputs[idx + 1].select();
}
return false;
}
});
无法关注可见输入。
答案 18 :(得分：-1)
如果您使用IE浏览器，这对我来说很有用：
<body onkeydown="tabOnEnter()">
<script type="text/javascript">
//prevents the enter key from submitting the form, instead it tabs to the next field
function tabOnEnter() {
if (event.keyCode==13)
{
event.keyCode=9; return event.keyCode
}
}
</script>