使用JavaScript控制Tab键顺序 [英] Controlling tab order with JavaScript
问题描述
我正在尝试使用键盘事件功能更改
元素在特定按下选项卡后获得焦点
元素。下面演示问题的简单HTML。
当在第二个输入框中按下选项卡时，我希望焦点移动到第一个
。它在IE中执行此操作，但不是Mozilla 1.7.10。我可以通过将事件从onkeydown
更改为onkeypress来使其在Mozilla中运行，但之后它在IE中无效。是否有任何
的方式来完成这项工作，而不必根据浏览器类型制作
内联事件类型？
谢谢。
< html>
< head>
< title>
测试标签
< / title>
< script type =" text / javascript">
function check_tab（e） {
if（e.keyCode == 9）{
document.getElementById（''i1''）。focus（）;
e.returnValue = false; //对于IE
if（e.preventDefault）e.preventDefault（）; //对于Mozilla
}
}
< / script>
< / head>
< body>
< input type =" text" id =" i1" />
< br />
< input type =" text" ID = QUOT; I2" onkeydown =" check_tab（event）"
< br />
< button type =" button"> Button< / button> ;
< / body>
< / html>
Hi,
I''m trying to use a keyboard event function to change what
element gets the focus after tab is pressed in a particular
element. Simple HTML that demonstrates the problem is below.
When tab is pressed in the second input box I want focus to move
to the first. It does this in IE, but not Mozilla 1.7.10. I
can make it work in Mozilla by changing the event from onkeydown
to onkeypress, but then it doesn''t work in IE. Is there any
way to make this work generally without having to make the
inline event type dependent on the browser type?
Thanks.
<html>
<head>
<title>
Test Tabs
</title>
<script type="text/javascript">
function check_tab(e) {
if (e.keyCode == 9 ) {
document.getElementById(''i1'').focus();
e.returnValue = false; // for IE
if (e.preventDefault) e.preventDefault(); // for Mozilla
}
}
</script>
</head>
<body>
<input type="text" id="i1"/>
<br/>
<input type="text" id="i2" onkeydown="check_tab(event)"/>
<br/>
<button type="button">Button</button>
</body>
</html>
推荐答案
Mark Reginald James于2005年9月24日下午2:28发表以下内容：
Mark Reginald James said the following on 9/24/2005 2:28 PM:
我正在尝试使用键盘事件功能来改变什么
元素在特定
元素中按下选项卡后获得焦点。演示此问题的简单HTML如下所示。
Hi,
I''m trying to use a keyboard event function to change what
element gets the focus after tab is pressed in a particular
element. Simple HTML that demonstrates the problem is below.
您的问题是您正试图重新定义浏览器
的工作方式。这会让用户感到困惑，因为他们期望默认的
行为并且你正在使用它。
如果你想更改Tab键顺序，请设置tabindex。
< URL： http://www.w3.org/TR/REC-html40/inte...#adef-tabindex >
问题解决了。
-
兰迪
comp.lang.javascript常见问题 - http://jibbering.com/faq &新闻组周刊
Your problem is that you are trying to redefine the way the browser
works. That is going to confuse users because they expect the default
behavior and you are screwing with it.
If you want to change the tab order, set the tabindex.
<URL: http://www.w3.org/TR/REC-html40/inte...#adef-tabindex >
Problem solved.
--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Randy Webb写道：
Randy Webb wrote:
Mark Reginald James于2005年9月24日下午2:28发表以下声明：
Mark Reginald James said the following on 9/24/2005 2:28 PM:
我正在尝试使用键盘事件功能来更改
元素在特定按下选项卡后获得焦点的内容>元素。演示此问题的简单HTML如下所示。
Hi,
I''m trying to use a keyboard event function to change what
element gets the focus after tab is pressed in a particular
element. Simple HTML that demonstrates the problem is below.
您的问题是您正在尝试重新定义浏览器的工作方式。这会让用户感到困惑，因为他们期望默认的行为，而你正在使用它。
如果你想更改Tab键顺序，请设置tabindex。
< URL： http： //www.w3.org/TR/REC-html40/inte...#adef-tabindex >
问题解决了。
Your problem is that you are trying to redefine the way the browser
works. That is going to confuse users because they expect the default
behavior and you are screwing with it.
If you want to change the tab order, set the tabindex.
<URL: http://www.w3.org/TR/REC-html40/inte...#adef-tabindex >
Problem solved.
感谢Randy，但我认为我不能轻易做到这一点，如果有的话。
我真正在做的是插入一个新的文本框当焦点
丢失在一组的底部文本框和
的内容时，该框是非空白的。如果通过单击
另一个元素丢失焦点，则将焦点移到那里。但是如果tab按下了
，焦点应移到新框。
动态设置tabindices会非常复杂，
我甚至不确定浏览器是否会立即将
考虑在新创建的盒子的tabindex中。
代码我给了作品，它只是依赖于浏览器。我不知道为什么onkeydown和onkeypress在Mozilla中有不同的标签相关的
行为。
Thanks Randy, but I don''t think I can do that easily, if at all.
What I''m really doing is inserting a new text box when focus
is lost on the bottom text box of a set and the contents of
the box is non-blank. If focus is lost by clicking on
another element, then move the focus there. But if tab is
pressed, focus should move to the new box.
It would be quite complicated to dynamically set the tabindices,
and I''m not even sure whether browers will immediately take
into account the tabindex of the newly-created box.
The code I gave works, it''s just browser-dependent. I don''t
know why onkeydown and onkeypress have different tab-related
behaviour in Mozilla.
我已经以某种方式获得了这个自动表单扩展代码
工作，无需阻止
tab动作加上使用focus（），或使用tabIndex。 br />
不知道我做了什么，但现在tab触发了
onkeydown事件，创建了新的框，然后
标签行为正在激活新的盒子。
我还有一个onblur触发器，它也会在新盒子中创建
，除非onkeydown事件已经创建了
。
如果你在原始盒子的onchange事件中创建它，那么新的盒子在标签后面没有焦点。你需要使用原始盒子的onkeydown / onblur组合。
希望有人觉得这很有帮助。
I''ve somehow got this auto-form-extension code
working without the need for either blocking
the tab action plus using focus(), or using tabIndex.
Not sure what I did, but now tab triggers the
onkeydown event, creating the new box, then
the tab behaviour is activating the new box.
I also have an onblur trigger that also creates
the new box unless the onkeydown event has already
created it.
The new box doesn''t get the focus after a tab if you
create it in the original box''s onchange event. You
have to use the original box''s onkeydown/onblur combo.
Hope someone finds this helpful.
这篇关于使用JavaScript控制Tab键顺序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
