如何在javascript或jQuery中模拟ENTER键上的TAB
How to simulate TAB on ENTER keypress in javascript or jQuery
我想在页面的所有输入中更改键下键(按键(中的键码。我想将输入键代码替换为 TAB 键代码。我该怎么做?
谢谢
编辑 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 键时转到下一个控件。
谢谢
我遇到了类似的问题,我想按数字键盘上的 + 键转到下一个字段。现在我发布了一个库,我认为它会对你有所帮助。
PlusAsTab:一个jQuery插件,使用numpad plus键作为Tab键等效项。
由于您想要输入/↵,因此可以设置选项。找出要与 jQuery 事件一起使用的键。
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"
添加到要在其中使用的表单字段 enter-as-tab 或包含这些表单字段的其他元素来启用该功能。单选按钮应该不是问题,因为它们被我的另一个库 EmulateTab 所涵盖 - 请参阅该演示中单选按钮的自动导航。
<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 替换为制表符:
$("#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);
}
});
现场演示
更新:
这段代码将重点放在下一个元素上:
$(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();
}
}
}
});
});
希望这有效
$('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();
}
});
$('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/
我这样做的方法是使用 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;
}
});
}
});
我认为这项工作:
$('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;
}
});
我创建了一个简单的jQuery插件,它确实解决了这个问题。它使用 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;
}
});
$(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();
}
});
});
相关文章:
- 使用向下箭头键(与tab键一样)聚焦下一个输入
- 当我在form_for中的text_field_tag中点击Enter时,如何禁止发出POST请求
- 禁用Tab键以进行具有特定Div ID的输入
- Tab键不会't继续chrome/IE11中的表单字段
- JavaScript:在调用函数的文本输入上按enter键
- Javascript-iPad Tab键检测,带蓝牙键盘
- 捕捉TAB键按下键向上
- D3js如何在.enter上下文中在同一级别附加两个子级
- ExtJ模拟按ENTER键时的TAB
- 在带有 TAB 键后按 Enter 触发一个按钮
- Jquery-如何使用TAB或ENTER键从TABLE TD更改
- 使用tab键更改焦点颜色的按钮,并在按enter键时返回原始颜色
- 如何在javascript或jQuery中模拟ENTER键上的TAB
- 通过按Enter触发绑定到HTML按钮的JavaScript函数.(不使用Tab键)
- 执行任务时,tab或enter按下表单输入文本与骨干/木偶
- 我怎么知道一个特定的事件.keyCode对应一个字符,而不是一个命令键(如箭头、tab或enter)
- jquery Enter as Tab在Firefox中不工作,但在Chrome中工作良好
- 如何在用户按Enter时触发Tab
- 网格& # 39;keydown # 39;事件不能捕捉特殊的键,如方向键、Enter键或Tab键
- Tab键到ASP按钮上,然后按enter键启动按钮;不要点击开火