1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. 

  2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. 

  3. <head>
    4. 

  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    5. 

  5. <title>同步文本框内容的JS代码</title>
    6. 

  6. </head>
    7. 

  7. <body>
    8. 

  8. <script language="JavaScript" type="text/javascript">
    9. 

  9. function addEvent(eventHandler)
    10. 

  10. {
    11. 

  11. var tags = document.getElementsByTagName('input');
    12. 

  12. for(var i=0;i<tags.length;i++)
    13. 

  13. {
    14. 

  14. if(tags[i].getAttribute('url') == 'true')
    15. 

  15. {
    16. 

  16. if(tags[i].addEventListener)
    17. 

  17. {
    18. 

  18. tags[i].addEventListener('keyup',eventHandler,true);
    19. 

  19. }
    20. 

  20. else
    21. 

  21. {
    22. 

  22. tags[i].attachEvent('onkeyup',eventHandler);
    23. 

  23. }
    24. 

  24. }
    25. 

  25. }
    26. 

  26. }
    27. 

  27. function addInput(e)
    28. 

  28. {
    29. 

  29. var obj = e.target ? e.target : e.srcElement;
    30. 

  30. var tags = document.getElementsByTagName('input');
    31. 

  31. for(var i=0;i<tags.length;i++)
    32. 

  32. {
    33. 

  33. if(tags[i].getAttribute('url') == 'true'&&tags[i]!=obj)
    34. 

  34. {
    35. 

  35. tags[i].value = obj.value;
    36. 

  36. }
    37. 

  37. }
    38. 

  38. }
    39. 

  39. window.onload = function()
    40. 

  40. {
    41. 

  41. addEvent(addInput);
    42. 

  42. }
    43. 

  43. </script>
    44. 

  44. <p>
    45. 

  45. <input id="addr_more1" size="35" value="http://www." name="addr_more1" url="true" />
    46. 

  46. </p>
    47. 

  47. <p>
    48. 

  48. <input id="addr_more2" size="35" value="http://www." name="addr_more2" url="true" />
    49. 

  49. </p>
    50. 

  50. <p>
    51. 

  51. <input id="addr_more3" size="35" value="http://www." name="addr_more3" url="true" />
    52. 

  52. </p>
    53. 

  53. <p>
    54. 

  54. <input id="addr_more4" size="35" value="http://www." name="addr_more4" url="true" />
    55. 

  55. </p>
    56. 

  56. <p>查找更多代码，请访问：<a href="http://www.lanrentuku.com" target="_blank">懒人图库</a></p>
    57. 

  57. </body>
    58. 

  58. </html>

650) this.width=650;" border="0" alt="" src="http://img1.51cto.com/attachment/201203/105447605.png" />

同步文本框内容的JS代码的更多相关文章

  1. js监听文本框内容变化

    js监听文本框内容变化 原理很简单,就是在外部先声明一个用来记录input值的变量,然后每0.1秒比较这个值与input的值,如果发生改变,则运行自己的代码,同时改变变量.从而实现对input值改变的 ...

  2. JS实时检测文本框内容长度

    通过js代码实时监测,文本框内容的变化以及长度,下图是一个实际使用场景. HTML部分: <input id="Text1" type="text" on ...

  3. js获取子节点和修改input的文本框内容

    js获取子节点和修改input的文本框内容 js获取子节点: $("#"+defaultPVItemId).children().eq(3); //获取某个选择器下的第四个子节点 ...

  4. JS事件 文本框内容改变事件（onchange）通过改变文本框的内容来触发onchange事件，同时执行被调用的程序。

    文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...

  5. jQuery—— jQuery get方法+一般处理程序处理文本框内容

    网上常常看到这种交互方式,当去一个站点注冊username的时候,假设文本框内没有输入数据,或者数据输入的内容格式不正确.就会将文本框变成红色来提示你输入的内容有误. 自己将这个文本框验证的方式改变了 ...

  6. Input文本框属性及js

    <input id="txt_uname" maxlength="16" onblur="validata()" onkeyup=&q ...

  7. wxpython 支持python语法高亮的自定义文本框控件的代码

    在研发闲暇时间,把开发过程中比较重要的一些代码做个珍藏,下面的代码内容是关于wxpython 支持python语法高亮的自定义文本框控件的代码,应该是对大家也有用. import keywordimp ...

  8. python开发_tkinter_获取文本框内容_给文本框添加键盘输入事件

    在之前的blog中有提到python的tkinter中的菜单操作 python开发_tkinter_窗口控件_自己制作的Python IDEL_博主推荐 python开发_tkinter_窗口控件_自 ...

  9. 捕获input 文本框内容改变的事件(onchange,onblur,onPropertyChange比较)

    input 文本框内容改变,可以使用onchange或者onblur来判断,但onchange是在文本内容改变,然后失去焦点的时发生,onblur是在失去焦点时发生,不会自己去判断. 如: <i ...

随机推荐

  1. benchmark

    redis benchmark How many requests per second can I get out of Redis? Using New Relic to Understand R ...

  2. Quartz.net打造信息抽取器

    由于最近的一个项目需要定时抽取特定XML信息,然后保存到数据库,最后通过WebApi把手机端要使用的方法给暴露出来,所以去研究了一下Quartz.net.由于项目很小,我没用到Autofac,Repo ...

  3. 熟悉linux开发环境（实验）

    北京电子科技学院(BESTI) 实验报告 课程: 深入理解计算机系统 班级: 1353班 姓名:张若嘉 杨舒雯 学号:20135330 20135324 成绩: 指导教师:娄嘉鹏 实验日期:2015. ...

  4. Jenkins进阶系列之——12详解Jenkins节点配置

    2014-03-02:修正对于lable标签的理解.(1.532.1版本已经给出了官方解释) 2013-12-22:添加JNLP端口修改,修改了一些错误. Jenkins有个很强大的功能:分布式构建( ...

  5. 学习笔记——Maven实战（六）Gradle，构建工具的未来？

    Maven面临的挑战 软件行业新旧交替的速度之快往往令人咂舌,不用多少时间,你就会发现曾经大红大紫的技术已经成为了昨日黄花,当然,Maven也不会例外.虽然目前它基本上是Java构建的事实标准,但我们 ...

  6. php利用递归函数实现无限级分类

    相信很多学php的很多小伙伴都会尝试做一个网上商城作为提升自己技术的一种途径.各种对商品分类,商品名之类的操作应该是得心应手,那么就可以尝试下无限级分类列表的制作了. 什么是无限级分类? 无限级分类是 ...

  7. [bzoj2245][SDOI2011]工作安排（费用流）

    题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=2245 分析: 要注意到题目下面说的w是单增的 明显的费用流: 弄个源点S,汇点T S连 ...

  8. 11.C#迭代器(六章6.1)

    今天我们说下C#中的迭代器,首先引出一些关于迭代的概念,后面举出代码供大家讨论. 迭代器模式是行为模式的一种范例,行为模式是一种简化对象之间通信的一种设计模式.在.NET中使用IEnumerator和 ...

  9. Flex ObjectHandles 构建绘图程序!

    模型 主画布组件:com/components/graph/GraphContainer.mxml <?xml version="1.0" encoding="ut ...

  10. DOM（八）使用DOM控制表单

    1.表单简介 表单<form>是网页中交互最多的形式之一,它通过各种形式接收用户的数据,包括下拉列表框,单选按钮,复选框和文本框,本篇主要介绍表单中常用的属性和方法 javascript中 ...