zoukankan      html  css  js  c++  java
  • 关于表单序列化的三种方法

    表单序列化:

    方法1:serialize(): 就是把表单信息序列化成一个字符串 (认为最常用 的方法)

    <html>
    <head>
    <script type="text/javascript" src="/jquery/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
        $("div").text($("form").serialize());
      });
    });
    </script>
    </head>
    <body>
    <form action="">
    First name: <input type="text" name="FirstName" value="Bill" /><br />
    Last name: <input type="text" name="LastName" value="Gates" /><br />
    </form>
    
    <button>序列化表单值</button>
    <div></div>
    </body>
    </html>
    

      

    最终序列化出的结果就是:FirstName=Bill&LastName=Gates 
    这样的一个字符串

    方法2:serializeArray() 
    它返回的是一个json 对象 而不是一个字符串

    <html>
    <head>
    <script type="text/javascript" src="/jquery/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
        x=$("form").serializeArray();
    var x = JSON.stringify(x)
    document.write(x)
    
      });
    });
    </script>
    </head>
    <body>
    <form action="">
    First name: <input type="text" name="FirstName" value="Bill" /><br />
    Last name: <input type="text" name="LastName" value="Gates" /><br />
    </form>
    
    <button>序列化表单值</button>
    <div id="results"></div>
    </body>
    </html>
    

     这是最后获取出来的值 [{"name":"FirstName","value":"Bill"},{"name":"LastName","value":"Gates"}]

    方法3:是自己自定义的serializeJson()方法:

    <form>  
        <input type="text" name="username" />  
        <input type="text" name="password" />  
    </form>  
    
    <script>
    jQuery.prototype.serializeObject=function(){  
        var obj=new Object();  
        $.each(this.serializeArray(),function(index,param){  
            if(!(param.name in obj)){  
                obj[param.name]=param.value;  
            }  
        });  
        return obj;  
    };  
    </script>
    

      

    最后执行 得到的结果如下:

    jQuery("form").serializeObject(); //{username:"",password:""} 
  • 相关阅读:
    C# 中 finally 的用法
    相似度算法(转载)
    OpenCV 安装与调试
    win7 debug 工具
    wpf 登录时显示状态动态图
    C# 比较两张图片是否完全相同
    ABSD 基于架构的软件设计方法方法简介(摘抄)
    基于SQL Server的简单数据同步方案
    软件:产品和过程的统一(转)
    cpp extern 关键字用法
  • 原文地址:https://www.cnblogs.com/tanzq/p/9857213.html
Copyright © 2011-2022 走看看