zoukankan      html  css  js  c++  java
  • JS获取TextArea和Input的同步值

    在提交表单时,如果只是表单值,用一个form即可,但有时候需要将整个表单一起提交,则可通过以下js实现。

     1 <!DOCTYPE html>
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5     <title></title>
     6     <script type='text/javascript'>
     7         function JSHtml() {
     8             //同步TextArea填写值
     9             var els = document.getElementsByTagName('TextArea');
    10             for (var i = 0; i < els.length; i++) {
    11                 els[i].innerHTML = els[i].value;
    12             }
    13 
    14             //同步INPUT填写值
    15             var els1 = document.getElementsByTagName('INPUT');
    16             for (var i1 = 0; i1 < els1.length; i1++) {
    17                 //alert(els1[i1].value);
    18                 //els1[i1].value = els1[i1].value;//不可以
    19                 els1[i1].setAttribute("value", els1[i1].value);//可以
    20             }
    21 
    22             alert(document.getElementById("wjj").innerHTML);
    23         }</script>
    24 </head>
    25 <body>
    26     <div id="wjj">
    27         <input id="input1" value="哈哈" />
    28         <br />
    29         <textarea id='TextArea2' rows='4' cols='30'>根据实际情况</textarea>
    30     </div>
    31     <br />
    32     <input type="button" value="显示同步值" onclick="JSHtml();" />
    33 </body>
    34 </html>

      运行效果:



    青春是孤独的旅行[Stay hungry,Stdy foolish]
  • 相关阅读:
    [ASP.NET] 使用 ASP.NET SignalR 添加实时 Web
    [ORM] Entity Framework(2) CodeFirst进阶
    [ORM] Entity Framework(1) CodeFirst快速入门
    [C#] 谈谈异步编程async await
    [Solution] NPOI操作Excel
    消息队列二
    消息队列一
    redis成长之路——(七)
    redis成长之路——(六)
    redis成长之路——(五)
  • 原文地址:https://www.cnblogs.com/gagarinwjj/p/3324324.html
Copyright © 2011-2022 走看看