同步文本框内容JS代码实现


Posted in Javascript onAugust 04, 2016

本文实例为大家分享了同步文本框内容JS代码,供大家参考,具体内容如下

图例1 

同步文本框内容JS代码实现

<html>
<body>
<script language="JavaScript" type="text/javascript">
  function addEvent(eventHandler)
  {
    var tags = document.getElementsByTagName('input');
    for(var i=0;i<tags.length;i++)
    {
      if(tags[i].getAttribute('url') == 'true')
      {
        if(tags[i].addEventListener)
        {
          tags[i].addEventListener('keyup',eventHandler,true);
        }
        else
        {
          tags[i].attachEvent('onkeyup',eventHandler);
        }
      }
    }
  }
  function addInput(e)
  {
    var obj = e.target ? e.target : e.srcElement;
    var tags = document.getElementsByTagName('input');
    for(var i=0;i<tags.length;i++)
    {
      if(tags[i].getAttribute('url') == 'true'&&tags[i]!=obj)
      {
        tags[i].value = obj.value;
      }
    }
  }
  window.onload = function()
  {
    addEvent(addInput);
  }
</script>

<p>
 <input id="addr_more1" size="35" value="" name="addr_more1" url="true" />
</p>
<p>
 <input id="addr_more2" size="35" value="" name="addr_more2" url="true" />
</p>
<p>
 <input id="addr_more3" size="35" value="" name="addr_more3" url="true" />
</p>
<p>
 <input id="addr_more4" size="35" value="" name="addr_more4" url="true" />
</p>

</body>
</html>

图例2 

同步文本框内容JS代码实现

<html>
<head>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
  <script type="text/javascript">
  function getNM(id)
    {
      var name2 = $("#"+id+"").val();
      if (name2 != "") {
      for(var i=3;i<6;i++)
        $("#NM"+i+"").val(name2);
      }
    }
  </script>
</head>
<body>
  <input type="text" id="NM1" value="" />
  <input type="text" id="NM2" value="" />
  <input type="text" id="NM3" value="" onkeyup="getNM(this.id)"/>
  <input type="text" id="NM4" value="" onkeyup="getNM(this.id)"/>
  <input type="text" id="NM5" value="" onkeyup="getNM(this.id)"/>
</body>
</html>

需要引用 <script type="text/javascript" src="jquery-1.4.4.min.js"></script>

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

Javascript 相关文章推荐
jquery ui对话框实例代码
May 10 Javascript
jquery动态添加option示例
Dec 30 Javascript
JS自调用匿名函数具体实现
Feb 11 Javascript
探讨js字符串数组拼接的性能问题
Oct 11 Javascript
javascript数组去重的方法汇总
Apr 14 Javascript
Javascript中的getUTCHours()方法使用详解
Jun 10 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
Apr 25 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
Nov 09 Javascript
基于javascript的Form表单验证
Dec 29 Javascript
vue中七牛插件使用的实例代码
Jul 28 Javascript
javascript/jquery实现点击触发事件的方法分析
Nov 11 jQuery
使用Vue Composition API写出清晰、可扩展的表单实现
Jun 10 Javascript
JS打印组合功能
Aug 04 #Javascript
Listloading.js移动端上拉下拉刷新组件
Aug 04 #Javascript
jQuery选择器总结之常用元素查找方法
Aug 04 #Javascript
Bootstrap中表单控件状态(验证状态)
Aug 04 #Javascript
Bootstrap实现input控件失去焦点时验证
Aug 04 #Javascript
html+js+highcharts绘制圆饼图表的简单实例
Aug 04 #Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
Aug 04 #Javascript
You might like
全国FM电台频率大全 - 27 陕西省
2020/03/11 无线电
无线电波是什么?它是怎样传输的?
2021/03/01 无线电
服务器端解压缩zip的脚本
2006/12/22 PHP
PHP时间戳 strtotime()使用方法和技巧
2013/10/29 PHP
php实现window平台的checkdnsrr函数
2015/05/27 PHP
js 左右悬浮对联广告特效代码
2014/12/12 Javascript
Web表单提交之disabled问题js解决方法
2015/01/13 Javascript
jQuery中live()方法用法实例
2015/01/19 Javascript
transport.js和jquery冲突问题的解决方法
2015/02/10 Javascript
arguments对象验证函数的参数是否合法
2015/06/26 Javascript
值得分享的轻量级Bootstrap Table表格插件
2016/05/30 Javascript
JavaScript中两个字符串的匹配
2016/06/08 Javascript
Bootstrap三种表单布局的使用方法
2016/06/21 Javascript
JavaScript中object和Object的区别(详解)
2017/02/27 Javascript
Express进阶之log4js实用入门指南
2018/02/10 Javascript
vue中的$emit 与$on父子组件与兄弟组件的之间通信方式
2018/05/13 Javascript
浅谈PDF.js使用心得
2018/06/07 Javascript
Angularjs实现数组随机排序的方法
2018/10/02 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
2018/10/23 Javascript
微信小程序实现的3d轮播图效果示例【基于swiper组件】
2018/12/11 Javascript
Node.js Domain 模块实例详解
2020/03/18 Javascript
vue-router之解决addRoutes使用遇到的坑
2020/07/19 Javascript
Python之Scrapy爬虫框架安装及简单使用详解
2017/12/22 Python
Python实现的简单排列组合算法示例
2018/07/04 Python
简单了解python PEP的一些知识
2019/07/13 Python
python shutil文件操作工具使用实例分析
2019/12/25 Python
python3.7通过thrift操作hbase的示例代码
2020/01/14 Python
解决Django中checkbox复选框的传值问题
2020/03/31 Python
jupyter notebook 添加kernel permission denied的操作
2020/04/21 Python
如何清空python的变量
2020/07/05 Python
HTML5在线预览PDF的示例代码
2017/09/14 HTML / CSS
探矿工程师自荐信
2014/01/24 职场文书
高中军训感言1000字
2014/03/01 职场文书
名人演讲稿范文
2014/09/16 职场文书
党员发展大会主持词
2015/07/03 职场文书
利用For循环遍历Python字典的三种方法实例
2022/03/25 Python