pay*_*ing 70 jquery events keyevent
我想要一个jquery解决方案,我必须接近,需要做什么?
$('html').bind('keypress', function(e)
{
if(e.keyCode == 13)
{
return e.keyCode = 9; //set event key to tab
}
});
Run Code Online (Sandbox Code Playgroud)
我可以返回false并且它阻止按下回车键,我想我可以将keyCode更改为9以使其成为选项卡但它似乎不起作用.我必须接近,发生了什么事?
Sar*_*raz 70
$('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;
}
});
Run Code Online (Sandbox Code Playgroud)
Bha*_*rat 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();
}
});
Run Code Online (Sandbox Code Playgroud)
为什么不这样简单?
$(document).on('keypress', 'input', function(e) {
if(e.keyCode == 13 && e.target.type !== 'submit') {
e.preventDefault();
return $(e.target).blur().focus();
}
});
Run Code Online (Sandbox Code Playgroud)
这样,除非您专注于"提交"的输入类型,否则不会触发提交,并且它会将您置于您离开的位置.这也使它适用于动态添加到页面的输入.
注意:对于可能具有任何"on blur"事件侦听器的任何人,blur()位于焦点()前面.该过程无需工作.
PlusAsTab也可配置为使用此演示中的回车键.看看我 对这个问题的一些旧答案 .
在您的情况下,使用整个页面的选项卡功能替换回车键(在选项中将回车键设置为选项卡后).
<body data-plus-as-tab="true">
...
</body>
Run Code Online (Sandbox Code Playgroud)
从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 );
Run Code Online (Sandbox Code Playgroud)
这是我一直在使用的:
$("[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();
}
});
Run Code Online (Sandbox Code Playgroud)
注意tabindex,不是特定于表单而是整个页面。
Note live已被 jQuery 废弃,现在您应该使用on