当前位置:96看吧 > 实用代码 > 网页特效 > JS特效实现多个输入内容框同步

JS特效实现多个输入内容框同步

时间:2014/05/26
作者:诚心
来源:96看吧
查看:
标签:js特效

 该JS特效实现多个输入内容框同步,兼容各类浏览器。属于原始JS并非jQuery。

  1. <script language="JavaScript" type="text/javascript"> 
  2.     function addEvent(eventHandler) 
  3.     { 
  4.         var tags = document.getElementsByTagName('input'); 
  5.         for(var i=0;i<tags.length;i++) 
  6.         { 
  7.             if(tags[i].getAttribute('url') == 'true') 
  8.             { 
  9.                 if(tags[i].addEventListener) 
  10.                 { 
  11.                     tags[i].addEventListener('keyup',eventHandler,true); 
  12.                 } 
  13.                 else 
  14.                 { 
  15.                     tags[i].attachEvent('onkeyup',eventHandler); 
  16.                 } 
  17.             } 
  18.         } 
  19.     } 
  20.     function addInput(e) 
  21.     { 
  22.         var obj = e.target ? e.target : e.srcElement; 
  23.         var tags = document.getElementsByTagName('input'); 
  24.         for(var i=0;i<tags.length;i++) 
  25.         { 
  26.             if(tags[i].getAttribute('url') == 'true'&&tags[i]!=obj) 
  27.             { 
  28.                 tags[i].value = obj.value; 
  29.             } 
  30.         } 
  31.     } 
  32.     window.onload = function() 
  33.     { 
  34.         addEvent(addInput); 
  35.     } 
  36. </script> 
  37. <p> 
  38.   <input id="addr_more1" name="addr_more1" size="35" value="http://www." url="true" /> 
  39. </p> 
  40. <p> 
  41.   <input id="addr_more2" name="addr_more2" size="35" value="http://www." url="true" /> 
  42. </p> 
  43. <p> 
  44.   <input id="addr_more3" name="addr_more3" size="35" value="http://www." url="true" /> 
  45. </p> 
  46. <p> 
  47.   <input id="addr_more4" name="addr_more4" size="35" value="http://www." url="true" /> 
  48. </p> 

 

上一篇:jQuery特效模拟iPhone单选框复选框效果
下一篇:js自动按比例显示图片,按比例压缩图片
演示地址
Demo
下载地址
Down
页面举报
Report
关闭页面
Close
收藏页面
Favorites
分享页面
Share
版权信息:栏目内,站内会员所分享的全部“资源/素材/文章”,仅供学习与参考,版权为原作者所有。
下载提示:非注册用户每天可下载一个文件,已注册会员不受限制。
网友评论
数据载入中
验证码
  • 请您注意:
  • ·请不要在评论中含与内容无关的广告链接。
  • ·不良评论请用报告管理员,以利管理员及时删除。
  • ·遵守中华人民共和国的各项有关法律法规
  • ·承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • ·本站管理人员有权保留或删除评论中的任意内容
  • ·您在本站发表的作品,本站有权在网站内转载或引用
  • ·参与本评论即表明您已经阅读并接受上述条款
相关最新
相关热门