AJAX表单用POST方式提交Checkbox复选框

<form action="submit.php" onsubmit="sendPostRequest(); return false;"  
  method="post" encType="multipart/form-data"> 
  <input type="checkbox" name="values[]" value="1" >post1<br> 
  <input type="checkbox" name="values[]" value="2" >post2<br> 
  <input type="checkbox" name="values[]" value="3" >post3<br> 
  <input id="submit" type="submit" value="Submit" name="submit"> 
  </form>

上面的form要无刷新提交表单，服务器端的$_POST['values']只有选中项的值，但用sendPostRequest()提交，不管是否选中选项，$_POST['values]永远包含所有选项的值。[break]
既然AJAX总是提交所有选项的值，那就把选项的值默认设为空，当选中的时候再赋值，就能保证服务器端只接收到选中项的值了。
方法是用一个函数来设置选项的值，把选项的值先保存在alt属性中，当选中时再把值赋值给value就可以了。

<form action="submit.php" onsubmit="sendPostRequest(); return false;"  
  method="post" encType="multipart/form-data"> 
  <input type="checkbox" name="values[]" value="" alt="1" onclick="checkboxValue(this);">post1<br> 
  <input type="checkbox" name="values[]" value="" alt="2" onclick="checkboxValue(this);">post2<br> 
  <input type="checkbox" name="values[]" value="" alt="3" onclick="checkboxValue(this);">post3<br> 
  <input id="submit" type="submit" value="Submit" name="submit"> 
  </form> 
<script language="JavaScript"> 
    function checkboxValue(obj) 
    { 
     if(obj.checked) 
     { 
      obj.value = obj.alt; 
     } 
     else 
     { 
      obj.value = ""; 
     } 
    } 
    </script>

JavaScript页面，post.js保存文件

function createXMLHttp() 
    { 
     var xmlhttp = false; 
     try 
     { 
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
     } 
     catch (e) 
      { 
      try 
      { 
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
      catch (E) 
      { 
       xmlhttp = false; 
      } 
     } 

     if (!xmlhttp && typeof XMLHttpRequest != 'undefined') 
     { 
      xmlhttp = new XMLHttpRequest(); 
     } 

     return xmlhttp; 
    } 

    function getRequestBody(oForm) 
    { 
     var aParams = new Array(); 

     for (var i=0 ; i < oForm.elements.length; i++) 
     { 
      var sParam = encodeURIComponent(oForm.elements[i].name); 
      sParam += "="; 
      sParam += encodeURIComponent(oForm.elements[i].value); 
      aParams.push(sParam); 
     } 

     return aParams.join("&"); 
    } 

    function sendPostRequest() 
    { 
     var oForm = document.forms[0]; 
     var sBody = getRequestBody(oForm); 

     var xmlhttp = createXMLHttp(); 
     xmlhttp.open("POST", oForm.action, true); 

     xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 

     xmlhttp.onreadystatechange = function() 
     { 
      if (xmlhttp.readyState == 4) 
      { 
       if (xmlhttp.status == 200) 
       { 
        // success 
       } 
       else 
       { 
        // failed 
       } 
      } 
     }; 

     xmlhttp.send(sBody); 
    }

这样就可以实现无刷新，就可以把表单的值提交