JavaScript实现自动跳转文本功能


Posted in Javascript onMay 25, 2017

贴一段自动跳转文本的代码实现:

实现代码:

<html>
  <head>
    <title>文本跳转</title>
    <style type=text/css>
      body{
        MARGIN-TOP: 10px;
        FONT-SIZE: 10pt;
        MARGIN-LEFT: 10px;
        MARGIN-RIGHT: 0px;
        FONT-FAMILY: "微软雅黑"
      }
    </style>
    <meta http-equiv=Content-Type content="text/html; charset=gb2312">
  </head>

  <body>
    <script type="text/javascript">
      function InBox1() {
        if(document.code.Box1.value.length == 4) {
          document.code.Box2.focus();
        }
      }

      function InBox2() {
        if(document.code.Box2.value.length == 4) {
          document.code.Box3.focus();
        }
      }

      function InBox3() {
        if(document.code.Box3.value.length == 4) {
          document.code.Box4.focus();
        }
      }
    </script>
    <formname="code" action="" method="post">输入:
      <input maxLength="4" size="4" name="Box1" onkeyup="return InBox1()">-
      <input maxLength="4" size="4" name="Box2" onKeyUp="return InBox2()">-
      <input maxLength="4" size="4" name="Box3" onKeyUp="return InBox3()">-
      <input maxLength="4" size="4" name="Box4">
    </form>
  </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
setInterval 和 setTimeout会产生内存溢出
Feb 15 Javascript
js调试工具 Javascript Debug Toolkit 2.0.0版本发布
Dec 02 Javascript
jQuery的学习步骤
Feb 23 Javascript
javascript模拟地球旋转效果代码实例
Dec 02 Javascript
浅谈轻量级js模板引擎simplite
Feb 13 Javascript
JavaScript中5种调用函数的方法
Mar 12 Javascript
详谈innerHTML innerText的使用和区别
Aug 18 Javascript
详解vue.js数据传递以及数据分发slot
Jan 20 Javascript
AngularJS中的作用域实例分析
May 16 Javascript
vue.js实现的幻灯片功能示例
Jan 18 Javascript
详解小程序如何改变onLoad的执行时机
Nov 01 Javascript
vue-video-player 解决微信自动全屏播放问题(横竖屏导致样式错乱问题)
Feb 25 Javascript
angularjs项目的页面跳转如何实现(5种方法)
May 25 #Javascript
AngularJS基于factory创建自定义服务的方法详解
May 25 #Javascript
AngularJS读取JSON及XML文件的方法示例
May 25 #Javascript
bootstrap+jQuery实现的动态进度条功能示例
May 25 #jQuery
基于VUE选择上传图片并页面显示(图片可删除)
May 25 #Javascript
jQuery滚动插件scrollable.js用法分析
May 25 #jQuery
Angular2学习教程之TemplateRef和ViewContainerRef详解
May 25 #Javascript
You might like
PHP Memcached应用实现代码
2010/02/08 PHP
PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数
2012/04/09 PHP
php 中的4种标记风格介绍
2012/05/10 PHP
PHP中$_SERVER的详细参数与说明介绍
2013/10/26 PHP
php简单统计中文个数的方法
2016/09/30 PHP
Knockout text绑定DOM的使用方法
2013/11/15 Javascript
javascript里绝对用的上的字符分割函数总结
2014/07/31 Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
2014/08/01 Javascript
AngularJS模块管理问题的非常规处理方法
2015/04/29 Javascript
JS实现的另类手风琴效果网页内容切换代码
2015/09/08 Javascript
JS实现Fisheye效果动感放大菜单代码
2015/10/21 Javascript
ReactJs快速入门教程(精华版)
2016/11/28 Javascript
微信小程序进行微信支付的步骤昂述
2016/12/01 Javascript
js 毫秒转天时分秒的实例
2017/11/17 Javascript
JSON生成Form表单的方法示例
2018/11/21 Javascript
JS+JQuery实现无缝连接轮播图
2020/12/30 jQuery
js动态生成表格(节点操作)
2021/01/12 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
Python爬虫框架Scrapy安装使用步骤
2014/04/01 Python
python3实现ftp服务功能(客户端)
2017/03/24 Python
Python使用folium excel绘制point
2019/01/03 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
基于css3的属性transition制作菜单导航效果
2015/09/01 HTML / CSS
网易微博Web App用HTML5开发的过程介绍
2012/06/13 HTML / CSS
西班牙英格列斯百货官网:El Corte Inglés
2016/09/25 全球购物
荷兰时尚精品店:Labels Fashion
2020/03/22 全球购物
如何在Shell脚本中使用函数
2015/09/06 面试题
护理工作感言
2014/01/16 职场文书
中学生自我评价范文
2014/02/08 职场文书
安全横幅标语
2014/06/09 职场文书
公司备用金管理制度
2015/08/04 职场文书
毕业生求职自荐信(2016最新版)
2016/01/28 职场文书
2016年推广普通话宣传周活动总结
2016/04/06 职场文书
python3.9之你应该知道的新特性详解
2021/04/29 Python
pytorch中F.avg_pool1d()和F.avg_pool2d()的使用操作
2021/05/22 Python
【TED出品】天梯非主流开心游1700 划水骑士
2022/03/31 魔兽争霸