社区
JavaScript
帖子详情
在表单中,如何使用Enter来替代Tab?
kkk2kkk
2004-08-27 11:59:02
我想建立这样一种效果:
在某个表单中有几个文本输入框和选择项,访问者在输入完一个文本框之后按回车就自动聚焦到下一个文本框或选择项(这个跳转顺序需要事先自定义),在使用Shift+Enter组合键时就能回退到上一个文本框或选择项
...全文
164
10
打赏
收藏
在表单中,如何使用Enter来替代Tab?
我想建立这样一种效果: 在某个表单中有几个文本输入框和选择项,访问者在输入完一个文本框之后按回车就自动聚焦到下一个文本框或选择项(这个跳转顺序需要事先自定义),在使用Shift+Enter组合键时就能回退到上一个文本框或选择项
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
10 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
vikingleo
2004-09-16
打赏
举报
回复
看看
kkk2kkk
2004-08-27
打赏
举报
回复
meizz(梅花雪) 的方法不错,测试过了,Enter键的效果实现了,但Shift+Enter组合键应该如何截取呢?
另外,我发现我的设计有一个漏洞:就是textarea区域内无法用Enter键来跳转到其他地方,因为textarea区域内本身就用Enter键来换行的,大家有什么好的解决思路吗?
谢谢meizz(梅花雪)、stefli((桂电)),我下午再测试一下,晚上结贴。
stefli
2004-08-27
打赏
举报
回复
那就不要使用tab方式,
直接
obj.focus() ;
meizz
2004-08-27
打赏
举报
回复
function enter2tab() //网页里按回车时焦点的转移
{
var e = document.activeElement;
var b = (e.tagName == "INPUT"
&& window.event.keyCode == 13
&& ( e.type == "text"
|| e.type == "password"
|| e.type == "checkbox"
|| e.type == "radio")
|| e.tagName=="SELECT");
var a = document.forms[0].elements, n=-1;
for(var i=0; i<a.length; i++)
{
if(a[i]==e) n=i;
if(n>-1 && b && n+1<a.length)
{
if(!a[n+1].disabled)
{
a[n+1].focus();
window.event.keyCode = 0;
window.event.returnValue= false;
return;
}
n=i;
}
}
}
kkk2kkk
2004-08-27
打赏
举报
回复
因为文本框和选择项之间会有一些链接,所以正常按Tab时是在所有项目之间轮流聚焦的,但我只想在文本框和选择项之间切换,而忽略其中夹杂的普通链接,所以必须要定义跳转顺序,不知道我这么解释,大家是否能够明白我的意图?
kkk2kkk
2004-08-27
打赏
举报
回复
我觉得实现方法应该有四个要点:
一、定义表单中文本框和选择项的跳转顺序;
二、拦截Enter键的输入;
三、拦截Shift(左、右)+Enter键的输入;
四、跳转部分:如果访问者按了Enter键或者Shift+Enter键,就根据按键时所在的文本框或选择项的自定义序号进行相应跳转。
meizz
2004-08-27
打赏
举报
回复
<input onkeydown="if(event.keyCode==13)event.keyCode=9">ENTER键可以让光标移到下一个输入框<br>
<input onkeydown="if(event.keyCode==13)event.keyCode=9"><br>
<input onkeydown="if(event.keyCode==13)event.keyCode=9"><br>
<input onkeydown="if(event.keyCode==13)event.keyCode=9"><br>
kkk2kkk
2004-08-27
打赏
举报
回复
还有一点不明白:
if(!a[n+1].disabled)中的disabled是什么意思?
kkk2kkk
2004-08-27
打赏
举报
回复
明白了,谢谢大家,结贴!
BubbleInDiamond
2004-08-27
打赏
举报
回复
如果是Netscape浏览器
触发的函数上加行参e,然后e.which代替event.keyCode
用
Enter
键代替
Tab
键
Delphi 组件; 将该控件放在窗体上即可用
Enter
键,或向上、向下箭头键代替
Tab
键切换焦点。
在填寫表單時用回車[
Enter
]代替[
Tab
]
在填寫表單時用回車[
Enter
]代替[
Tab
]
Vue
中
实现回车键切换焦点的方法
主要介绍了在Vue
中
实现回车键切换焦点的方法,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
AOM
中
IE、Firefox兼容
Enter
代替
Tab
的Javascript
AOM
中
IE、Firefox兼容
Enter
代替
Tab
的Javascript
表单
填写时用回车代替
TAB
的实现方法
关键之处在于
tab
index,其设计思想是:为每个
表单
元素设置一个
tab
index,其值分别为前一个
表单
元素的
tab
index的值加一,函数的功能就是当用户按下回车键时先将当前
tab
index的值加一,而后逐一与每个
表单
元素的
tab
index值进行对比,如若相等,则将焦点移至该
表单
元素之上。 首先,我们需要在
表单
体
中
设定一个onkeyup事件: <form name=”xxx” action=”YYY.asp” method=”post” onkeyup=”return changefocus_onkeyup()” language=”javascript”> 其次,在每一个
表单
元素
中
设
JavaScript
87,992
社区成员
224,698
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章