按回车键光标自动移动到下一个输入框。

最新推荐文章于 2024-03-29 19:05:28 发布

杰哥是大佬

最新推荐文章于 2024-03-29 19:05:28 发布

阅读量2.9k

点赞数 1

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_42165130/article/details/103390380

版权

本文介绍了如何使用原生JavaScript和jQuery实现在HTML页面中，当用户在输入框按下回车键时，光标能自动移动到下一个输入框。

摘要由CSDN通过智能技术生成

在html页面中有多个input 输入框,如何通过原生js或者jquery怎么实现:按回车键光标自动移动到下一个输入框。

1.原生Js实现：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gbk">
    <script type="text/javascript">
      function focusNextInput(thisInput){
          var inputs = document.getElementsByTagName("input");
          for(var i = 0;i<inputs.length;i++){
            // 如果是最后一个，则焦点回到第一个
            if(i==(inputs.length-1)){
              inputs[0].focus();
              break;
            }else if(thisInput == inputs[i]){
              inputs[i+1].focus();
              break;
            }
          }
      }  
    </script>
  </head>
<body>
  <table>
    姓名：<input type="text" onkeypress="if(event.keyCode==13) focusNextInput(this);