当前位置: 首页 > 编程笔记 >

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

陈正业
2023-03-14
本文向大家介绍同步文本框内容JS代码实现,包括了同步文本框内容JS代码实现的使用技巧和注意事项,需要的朋友参考一下

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

图例1 

<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 

<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>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍JS实现控制文本框的内容,包括了JS实现控制文本框的内容的使用技巧和注意事项,需要的朋友参考一下 JS 控制文本框只能输入数字 <input onkeyup="value=value.replace(/[^0-9]/g,'')" onpaste="value=value.replace(/[^0-9]/g,'')" oncontextmenu = "value=value.repla

  • 本文向大家介绍js限制文本框的输入内容代码分享(3类),包括了js限制文本框的输入内容代码分享(3类)的使用技巧和注意事项,需要的朋友参考一下 为大家分享的JavaScript限制文本框的输入内容代码如下 运行效果图: 下面再给大家补充一些: 小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号: 文本框只能输入数字代码(小数点也不能输入) 其实还可以限制其他内容,比如只能是字母,

  • 本文向大家介绍js点击文本框后才加载验证码实例代码,包括了js点击文本框后才加载验证码实例代码的使用技巧和注意事项,需要的朋友参考一下 经常到各大网站去留言或者发帖的朋友应该知道现在很多网站的留言地方的验证码不是直接显示的。而是在点击验证码输入框之后才会显示出来验证码的。下面作者也总结了一篇关于如何利用js实现点击文本框然后再加载验证码的效果的。 废话不多说了,下面是具体的实现代码。 以上这个就非

  • 在测试同步代码时,省略回调,Mocha将自动继续进行下一次测试。 describe('Array', function() { describe('#indexOf()', function() { it('should return -1 when the value is not present', function() { [1,2,3].indexOf(5).should.eq

  • 本文向大家介绍js实现鼠标点击文本框自动选中内容的方法,包括了js实现鼠标点击文本框自动选中内容的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js实现鼠标点击文本框自动选中内容的方法。分享给大家供大家参考。具体如下: 这里使用JS实现鼠标点击时自动选中文本框文本的效果,相信许多朋友都遇到这种功能的,就是当我们点击文本框的时候,文本框中默认的文字会被全部选中,这样当你输入的时候不用再

  • 本文向大家介绍js文本框输入内容智能提示效果,包括了js文本框输入内容智能提示效果的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js文本框输入内容智能提示效果代码。分享给大家供大家参考。具体如下: 运行效果截图如下: 大体思路: 1.监听文本框事件。这里是用的keyup事件。大家可以尝试用onchange事件。不过感觉keyup事件的效果要好一点。 2.根据输入内容通过ajax异步的方式