1 　　var formUtil = {
  2         // 獲取單選按鈕的值，如有沒有選的話返回null
  3         // elements為radio類的集合的引用
  4         getRadioValue:function(elements) {
  5             var value = null; // null表示沒有選中項
  6             // 非IE瀏覽器
  7             if(elements.value != undefined && elements.value != '') {
  8                 value = elements.value;
  9             } else {
 10                 // IE瀏覽器
 11                 for(var i = 0, len = elements.length; i < len; i++ ) {
 12                     if(elements[i].checked) {
 13                         value = elements[i].value;
 14                         break;
 15                     }
 16                 }
 17             }
 18             return value;
 19         },
 20         
 21         // 獲取多選按鈕的值，如有沒有選的話返回null
 22         // elements為checkbox類型的input集合的引用
 23         getCheckboxValue:function(elements) {
 24             var arr = new Array();
 25             for(var i = 0, len = elements.length; i < len; i++ ) {
 26                 if(elements[i].checked) {
 27                     arr.push(elements[i].value);
 28                 }
 29             }
 30             if(arr.length > 0) {
 31                 return arr.join(',');
 32             } else {
 33                 return null; // null表示沒有選中項
 34             }    
 35         },
 36         
 37         // 獲取下拉框的值
 38         // element為select元素的引用
 39         getSelectValue:function(element) {
 40             if(element.selectedIndex == -1) {
 41                 return null; // 沒有選中的項時返回null
 42             };
 43             if(element.multiple) {
 44                 // 多項選擇
 45                 var arr = new Array(), options = element.options;
 46                 for(var i = 0, len = options.length; i < len; i++) {
 47                     if(options[i].selected) {
 48                         arr.push(options[i].value);
 49                     }
 50                 }
 51                 return arr.join(",");
 52             }else{
 53                 // 單項選擇
 54                 return element.options[element.selectedIndex].value;
 55             }
 56         },
 57         
 58         // 序列化
 59         // form為form元素的引用
 60         serialize:function(form) {
 61             var arr = new Array(),
 62             elements = form.elements,
 63             checkboxName = null;
 64             for(var i = 0, len = elements.length; i < len; i++ ) {
 65                 field = elements[i];
 66                 // 不發送禁用的表單字段
 67                 if(field.disabled) {
 68                     continue;
 69                 }
 70                 switch (field.type) {
 71                     // 選擇框的處理
 72                     case "select-one":
 73                     case "select-multiple":
 74                         arr.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(this.getSelectValue(field)));
 75                         break;
 76                     
 77                     // 不發送下列類型的表單字段    
 78                     case undefined :
 79                     case "button" :
 80                     case "submit" :
 81                     case "reset" :
 82                     case "file" :
 83                         break;
 84                     
 85                     // 單選、多選和其他類型的表單處理     
 86                     case "checkbox" :
 87                         if(checkboxName == null) {
 88                             checkboxName = field.name;
 89                             arr.push(encodeURIComponent(checkboxName) + "=" + encodeURIComponent(this.getCheckboxValue(form.elements[checkboxName])));
 90                         }
 91                         break;
 92                     case "radio" :
 93                         if(!field.checked) {
 94                             break;
 95                         }
 96                     default:
 97                         if(field.name.length > 0) {
 98                             arr.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(field.value));
 99                         } 
100                 }
101             }
102             return arr.join("&");
103         } 
104     };

1　　 <form action="test_php.php" id="form1" name="form1" method="post" enctype="multipart/form-data">
 2         姓名：<input name="name" type="text" tabindex="1" /> <br>
 3         性別：<input name="sex" type="radio" value="男"/> 男 
 4              <input name="sex" type="radio" value="女" /> 女 <br>
 5         愛好：
 6         <input name="hobby" type="checkbox" value="籃球" /> 籃球
 7         <input name="hobby" type="checkbox" value="足球" /> 足球
 8         <input name="hobby" type="checkbox" value="乒乓球" /> 乒乓球
 9         <input name="hobby" type="checkbox" value="羽毛球" /> 羽毛球
10         <br />
11         年級：
12         <select name="class" multiple>
13             <option value="一年級">一年級</option>
14             <option value="二年級">二年級</option>
15             <option value="三年級">三年級</option>
16         </select>
17         <br />
18          其他：
19          <br />
20          <textarea name="other" rows="5" cols="30" tabindex="2"></textarea>
21          <br />
22          <input type="reset" value="重置" />
23          <input type="submit" value="提交" />
24     </form>
25     <div id="output"></div>

1　　 var form = document.getElementById("form1"),
 2     output = document.getElementById("output");
 3     
 4     // 自定義的提交事件
 5     EventUtil.addEventListener(form,"submit", function(event) {
 6         event = EventUtil.getEvent(event);
 7         EventUtil.preventDefault(event);
 8         var html = "";
 9         html += form.elements['name'].value + "<br>";
10         html += formUtil.getRadioValue(form.elements['sex']) + "<br>";
11         html += formUtil.getCheckboxValue(form.elements['hobby']) + "<br>";
12         html += formUtil.getSelectValue(form.elements['class']) + "<br>";
13         html += form.elements['other'].value + "<br>";
14         html += decodeURIComponent(formUtil.serialize(form)) + "<br>";
15         output.innerHTML = html;
16     });