zoukankan      html  css  js  c++  java
  • jQuery序列化元素

    学习了一下jQury序列化,分为两个方法,整理如下:

    <!DOCTYPE html>
    <html>
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    	<title>测试</title>
    	<script src="./jquery-1.8.1.min.js" type="text/javascript"></script>
    	<script>
    		$(function(){
    			$("#sendButton").click(function(){
    				//方法1 serialize()方法,该方法作用于一个jQuery对象,能够将DOM元素内容序列化成字符串
    				//该方法能够对中文进行编码处理,相应的需要进行解码处理
    				//该方法的核心是$.params()方法,用来将一个数组或者对象按照k/v进行序列化
    				var obj1 = $("#testForm").serialize();
    				console.log(decodeURIComponent(obj1,true));
    
    				//方法2 serializeArray()方法,将用作提交的表单元素的值编译成拥有name和value对象组成的数组。例如[ { name: a value: 1 }, { name: b value: 2 },...]
    				var obj2 = $("#testForm").serializeArray();
    				console.log(obj2);
    			})
    		})
    	</script>
    </head>
    <body>
    	<form id="testForm" action="#">
    		<input name = "name" placeholder="姓名"/>
    		<input name = "age" placeholder="年龄"/>
    		<input name = "height" placeholder="身高"/>
    		<input name = "hometown" placeholder="家乡"/>
    		<input id="sendButton" type="button" value="click"></input>
    	</form>
    </body>
    </html>
    


    API中并没有提供直接序列化成json对象的方法,可以在现有方法的基础上,稍作修改即可:

    <script type="text/javascript">  
        $(function() {  
            $("#sendButton").click(function() {  
                    var datas = $("#testForm").serializeJsonObj(); 
                    console.log(datas);  
                })  
        })  	  
        $.fn.serializeJsonObj = function() {  
            var result = {};  
            var temp = this.serializeArray();  
            $.each(temp, function() {  
                if (result[this.name]) {  
                    if (!result[this.name].push) {  
                        result[this.name] = [ result[this.name] ];  
                    }  
                    result[this.name].push(this.value || '');  
                } else {  
                    result[this.name] = this.value || '';  
                }  
            });  
            return result;  
        }  
    </script>
    

  • 相关阅读:
    [Sdoi2016]征途
    何时会发生db file sequential read等待事件?
    oracle分布式事务总结
    db file scattered read 等待事件
    db file sequential read (数据文件顺序读取)
    INDEX_JOIN
    Oracle优化器介绍
    GC Buffer Busy Waits处理(转载)
    Oracle V$SESSION详解
    Oracle锁表(转载)
  • 原文地址:https://www.cnblogs.com/xieshuang/p/6054272.html
Copyright © 2011-2022 走看看