jQuery 之使用 serialize() 方法序列化表单元素值

使用 serialize() 方法可以将表单中有 name 属性的元素值进行序列化，生成标准 URL 编码文本字符串，直接可用于 ajax 请求，它的调用格式如下：
$(selector).serialize()

其中 selector 参数是一个或多个表单中的元素或表单元素本身。
例如，在表单中添加多个元素，点击“序列化”按钮后，调用 serialize() 方法，将表单元素序列化后的标准 URL 编码文本字符串显示在页面中。
 
例：[code]<!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>
<title>使用 serialize() 方法序列化表单元素值</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

&lt;body&gt;
    &lt;div id=&quot;divtest&quot;&gt;
        &lt;div class=&quot;title&quot;&gt;
            &lt;span class=&quot;fl&quot;&gt;我的个人资料&lt;/span&gt; 
            &lt;span class=&quot;fr&quot;&gt;
                &lt;input id=&quot;btnAction&quot; type=&quot;button&quot; value=&quot;序列化&quot; /&gt;
            &lt;/span&gt;
        &lt;/div&gt;
        &lt;form action=&quot;&quot;&gt;
        &lt;ul&gt;
            &lt;li&gt;姓名：&lt;input name=&quot;Text1&quot; type=&quot;text&quot; size=&quot;12&quot; /&gt;&lt;/li&gt;
            &lt;li&gt;
                &lt;select name=&quot;Select1&quot;&gt;
                    &lt;option value=&quot;0&quot;&gt;男&lt;/option&gt;
                    &lt;option value=&quot;1&quot;&gt;女&lt;/option&gt;
                &lt;/select&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;input name=&quot;Checkbox1&quot; type=&quot;checkbox&quot; /&gt;资料是否可见 &lt;/li&gt;
            &lt;li id=&quot;litest&quot;&gt;&lt;/li&gt;
        &lt;/ul&gt;
        &lt;/form&gt;
    &lt;/div&gt;
    
    &lt;script type=&quot;text/javascript&quot;&gt;
        $(function () {
            $(&quot;#btnAction&quot;).bind(&quot;click&quot;, function () {
                $(&quot;#litest&quot;).html($(&quot;form&quot;).serialize());
            })
        })
    &lt;/script&gt;
&lt;/body&gt;

</html>[/code]结果：类似于如下的字符串
Text1=223&Select1=0&Checkbox1=on