• (转)基于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

  • 相关阅读:
    JS编码解码详解
    web的几种返回顶部
    图片的懒加载的两种效果
    获取两个日期差
    C#虚方法
    依赖注入(DI)和Ninject
    在应用程序级别之外使用注册为 allowDefinition='MachineToApplication' 的节是错误的
    PetShop的系统架构设计
    C#综合揭秘——细说多线程(下)
    C# Socket编程(4)初识Socket和数据流
  • 原文地址:https://www.cnblogs.com/canrz/p/3999686.html
Copyright © 2020-2023  润新知