zoukankan      html  css  js  c++  java
  • (转)基于jQuery的form转json示例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="application/javascript" src="js/jquery-2.0.3.js"></script>
    <title>无标题文档</title>
    <script type="application/javascript">
    
    $.fn.serializeObject = function()  
    {  
       var o = {};  
       var a = this.serializeArray();  
       $.each(a, function() {  
           if (o[this.name]) {  
               if (!o[this.name].push) {  
                   o[this.name] = [o[this.name]];  
               }  
               o[this.name].push(this.value || '');  
           } else {  
               o[this.name] = this.value || '';  
           }  
       });  
       return o;  
    };
    
    function onClik(){
            //var data = $("#form1").serializeArray(); //自动将form表单封装成json
            //alert(JSON.stringify(data));
            var jsonuserinfo = $('#form1').serializeObject();
            alert(JSON.stringify(jsonuserinfo));
    }
    </script>
    </head>
    
    <body>
    <form id="form1" name="form1" method="post" action="">
      <p>进货人 :
        <label for="name"></label>
        <input type="text" name="name" id="name" />
      </p>
      <p>性别:
        <label for="sex"></label>
        <select name="sex" size="1" id="sex">
          <option value="1"></option>
          <option value="2"></option>
        </select>
      </p>
      <table width="708" border="1">
        <tr>
          <td width="185">商品名</td>
          <td width="205">商品数量</td>
          <td width="296">商品价格</td>
        </tr>
        <tr>
          <td><label for="pro_name"></label>
            <input type="text" name="pro_name" id="pro_name" /></td>
          <td><label for="pro_num"></label>
            <input type="text" name="pro_num" id="pro_num" /></td>
          <td><label for="pro_price"></label>
            <input type="text" name="pro_price" id="pro_price" /></td>
        </tr>
        <tr>
          <td><input type="text" name="pro_name2" id="pro_name2" /></td>
          <td><input type="text" name="pro_num2" id="pro_num2" /></td>
          <td><input type="text" name="pro_price2" id="pro_price2" /></td>
        </tr>
      </table>
      <p> </p>
      <input type="button" name="submit" onclick="onClik();" value="提交"/>
    </form>
    </body>
    </html>
    $.fn.serializeObject = function()
    {
       var o = {};
       var a = this.serializeArray();
       $.each(a, function() {
           if (o[this.name]) {
               if (!o[this.name].push) {
                   o[this.name] = [o[this.name]];
               }
               o[this.name].push(this.value || '');
           } else {
               o[this.name] = this.value || '';
           }
       });
       return o;
    };

    原址:http://blog.csdn.net/zhangdaiscott/article/details/18456215

  • 相关阅读:
    DbContext 和ObjectContext两者的区别
    程序员的四大境界
    使用Entity Framework 4进行代码优先开发 转
    转 .Net 中的序列化与反序列化
    关于asp使用CreateObject("Excel.Application")出现无法创建ActiveX对象的错误
    内存泄漏的方法
    用Entities Framework实现代码优先和依赖注入所遇到的问题总结
    SQL去掉前面的0
    关于SVN限制填写备注和自动更新代码到网站的研究
    也许是离开的时候啦。
  • 原文地址:https://www.cnblogs.com/canrz/p/3999686.html
Copyright © 2011-2022 走看看