我工作的一个网站,是完全的形式需要填补我它要求当逃生按钮被按下的焦点移动到下一个输入控制,正如按下“标签”做。 我发现代码将焦点移动的keyPressed时是13,但是这需要采取元素的ID把重点放在
<input id="Text1" type="text" onkeydown="return noNumbers(event)" />
<input id="Text2" type="text" />
<script type="text/javascript">
function noNumbers(e) {
keynum = e.which;
if (keynum == 13)
document.getElementById("Text2").focus();
}
</script>
我需要一个广义函数,当按下键代码为13“即进入”火按9“即标签”的默认事件,当然在Javascript
这将处理多个输入字段。
这里是jQuery的版本: http://jsfiddle.net/TnEB5/3/
$('input').keypress(function(e) { if (e.which == 13) { $(this).next('input').focus(); e.preventDefault(); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="Text1" type="text" /> <input id="Text2" type="text" /> <input id="Text3" type="text" />
这里是纯JavaScript版本: http://jsfiddle.net/TnEB5/5/ (你可能想以不同的方式得到了兄弟姐妹)
function tab(e) { if (e.which == 13) { e.target.nextSibling.nextSibling.focus(); e.preventDefault(); } } var inputs = document.getElementsByTagName('input'); for (var x = 0; x < inputs.length; x++) { var input = inputs[x]; input.onkeypress = tab; }
<input id="Text1" type="text" /> <input id="Text2" type="text" /> <input id="Text3" type="text" />
处理按键代替并返回虚假的浏览器:
http://jsfiddle.net/EeyTL/
<input id="Text1" type="text" />
<input id="Text2" type="text" />
<script type="text/javascript">
document.getElementById('Text1').onkeypress = function (e) {
if (e.which === 13) {
document.getElementById("Text2").focus();
return false;
}
};
</script>
你需要明确设置tabindex
输入字段属性的通用解决方案。 就像是
<input id="Text1" type="text" tabindex="1" />
<input id="Text2" type="text" tabindex="2" />
<script type="text/javascript">
$('input').keypress(function(e){
if(e.which==13){
$("[tabindex='"+($(this).attr("tabindex")+1)+"']").focus();
e.preventDefault();
}
});
</script>
这个解决方案使用的jquery分配的页面上的所有输入型元件的事件处理程序,将焦点设置到元件具有下一最高tabIndex属性,并且防止从形式使用e.preventDefault被按下时进入提交()。 这里有一个jfiddle
<input type="text" value="" onkeyup="doNext(this);"> a <br>
<input type="text" value="" onkeyup="doNext(this);"> b <br>
<input type="text" value="" onkeyup="doNext(this);"> c <br>
function doNext(el){
if(event.keyCode=='13'){
var nextEl = el.form.elements[el.tabIndex+1];
if (nextEl && nextEl.focus) nextEl.focus();
}
}
Althought后已经老了,我希望我的回答能帮助别人需要的人。 我有一个smilar情况:
我有不同类型的输入字段的雇员调度应用一个非常大的形式 。 一些输入字段是隐藏的,有时,而不是其他时间。 有人问我,使进入关键表现为tab键 ,以便形式的用户创建thier员工的时间表时,可以使用10键。 这是我如何解决我的问题:
$(document).ready(function () {
var allInputs = $(':text:visible'); //(1)collection of all the inputs I want (not all the inputs on my form)
$(":text").on("keydown", function () {//(2)When an input field detects a keydown event
if (event.keyCode == 13) {
event.preventDefault();
var nextInput = allInputs.get(allInputs.index(this) + 1);//(3)The next input in my collection of all inputs
if (nextInput) {
nextInput.focus(); //(4)focus that next input if the input is not null
}
}
});
});
我所要做的就是:
- 创建的所有我想跳格时,考虑到输入的集合。 在我的情况下,它是文本输入,是可见的。
- 听有问题的输入的keydown事件,在我的情况下,所有的文本字段输入
- 当进入压在我的文字输入,确定什么样的输入是下一个被聚焦。
- 如果输入的是有效的,使之成为关注的焦点。
我使用此代码为推进到下一个输入字段。 我恨按TAB键。 而这个解决方案在IE和Firefox:
<script type="text/javascript">
function tabE(obj,e){
var e=(typeof event!='undefined')?window.event:e;// IE : Moz
if(e.keyCode==13){
var ele = document.forms[0].elements;
for(var i=0;i<ele.length;i++){
var q=(i==ele.length-1)?0:i+1;// if last element : if any other
if(obj==ele[i]){ele[q].focus();break}
}
return false;
}
}
</script>
HTML内容
<form id="main">
<input name="" type="text" onkeypress="return tabE(this,event)">
<input type="submit" value="Ok">
</form>
我相信使用e.preventDefault(); 比返回false更安全。