JavaScript回车切换焦点

最新推荐文章于 2022-03-11 11:43:58 发布

原创最新推荐文章于 2022-03-11 11:43:58 发布 · 3.5k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript #input #function #button #jquery

JavaScript 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一段JavaScript代码，该代码可在用户按下回车键时自动将焦点切换到下一个文本输入框，模仿Tab键行为。此外还提供了一个测试示例，包括使用jQuery的方法。

回车键按下时，自动以Tab键方式在文本输入框之间进行焦点切换的JavaScript代码：

如果注册了多个键盘监听事件，虽然在代码段中修改keyCode值，其它键盘监听事件获得的仍然是原始keyCode。这和JavaScript事件模型有关（记得是分别从各个注册的监听事件开始，各自沿着自己的路线进行事件传播）。

以下是测试代码：

<html> <HEAD>  <script src="jquery.js"></script> <script src="jquery.hotkeys.js"></script> <script> $(function(){ $(document).keydown(function(evt){ debug(evt); }); }); </script>  <script language='javascript' for='document' event='onkeydown'> if(event&&event.srcElement){ srcEle=event.srcElement; if((event.keyCode||event.charCode)==13 && srcEle.tagName.toUpperCase()=='INPUT' && srcEle.type.toUpperCase()=='TEXT') event.keyCode=event.charCode=9; } </script>  <script> $(':input').bind('keydown','return',function(evt){ event.keyCode=event.charCode=9;//注意：如果使用ajax，要设置为“非同步方式”，否则event对象已经不存在了。 }) </script> <script> function debug(evt){ document.getElementById('info').innerText=evt.keyCode||evt.charCode; } </script> </HEAD> <BODY> <input type=text onkeydown="debug(event);"><br> <input type=text><br> <input type=text><br> <input type=text><br> <input type=button value="Button"> <br><br> 按键代码：<span id=info></span> </html>