• jQuery表单序列化


    方法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:""}  
  • 相关阅读:
    [LUOGU]P1443 马的遍历
    NOIP 2017 D2T1 奶酪
    [0] Hello World
    网络测速 风行天下
    zabbix自动发现与监控内存和CPU使用率最高的进程,监测路由器 风行天下
    网络性能测试工具iperf 风行天下
    Centos7下杀毒软件clamav的安装和使用 风行天下
    LINUX漏洞安全防护防火墙相关 风行天下
    smokeping配置方法 风行天下
    vb+MAPX 数据绑定
  • 原文地址:https://www.cnblogs.com/qfdy123/p/11351704.html
Copyright © 2020-2023  润新知