使用特定順序進行序列化

Question

我在嘗試從特定順序的窗體序列化複選框值。 變量必須遵循字母順序。只要變量順序受到尊重，值順序就無關緊要。

This is the fiddle

這是HTML表單：

<form> 
    <input type="checkbox" value="value1"/> 
    <input type="checkbox" value="value2"/> 
    <input type="checkbox" value="value3"/> 
    <input type="checkbox" value="value4"/> 
    <input type="checkbox" value="value5"/> 
    <input type="checkbox" value="value6"/> 
    <input type="checkbox" value="value7"/> 
    <input type="checkbox" value="value8"/> 
    <input type="checkbox" value="value9"/> 
    <input type="checkbox" value="value10"/> 
</form> 
<p id="results"></p>​ 

這是jQuery腳本：

$(document).ready(function(){ 
    $("input:checkbox").change(function(){ 
     var checked = $("input:checked").size(); 
     var name_a = $("input:checked[name=a]").size(); 
     var name_b = $("input:checked[name=b]").size(); 
     var name_c = $("input:checked[name=c]").size(); 
     var name_d = $("input:checked[name=d]").size(); 
     var name_e = $("input:checked[name=e]").size(); 

     if(name_a<1){ 
     $(this).attr("name","a"); 
     }else if(name_b<1){ 
     $(this).attr("name","b"); 
     }else if(name_c<1){ 
     $(this).attr("name","c"); 
     }else if(name_d<1){ 
     $(this).attr("name","d"); 
     }else if(name_e<1){ 
     $(this).attr("name","e"); 
     }; 

     if (checked>5) { 
     $(this).attr("checked", false); 
     } 
    }); 

    function showValues() { 
     str = $("form").serialize(); 
     $("#results").text(str); 
    } 
    $(":checkbox").click(showValues); 
    $("select").change(showValues); 
    showValues(); 
});​ 

我期待什麼：

a=valueX or... 
a=valueX&b=valueX or... 
a=valueX&b=valueX&c=valueX or... 
a=valueX&b=valueX&c=valueX&d=valueX or... 
a=valueX&b=valueX&c=valueX&d=valueX&e=valueX 

我不想要什麼：

b=valueX or... 
b=valueX&a=valueX or... 
a=valueX&c=valueX or... 
b=valueX&a=valueX&c=valueX&d=valueX&e=valueX 

我希望你能明白我在找什麼。任何幫助將appriciated！

注意：嘗試隨機檢查並取消選中輸入以確保代碼正常工作。

Answer 1

請讓我知道，如果我已經明白這個問題很好：

$(document).ready(function(){ 
    $("input:checkbox").change(function(){ 
     var $checked = $(":checked"); 
     if($checked.length > 5) { 
      $(this).removeAttr("checked"); 
      return; 
     } 
     $checked.siblings() 
      .andSelf().removeAttr("name"); 
     $checked.each(function(i, o) { 
      $(this).attr("name", String.fromCharCode(97+i)); 
     }); 
     showValues(); 
    }); 

    function showValues() { 
     str = $("form").serialize(); 
     $("#results").text(str); 
    } 
    /*$(":checkbox").click(showValues); 
    $("select").change(showValues);*/ 
    showValues(); 
});​ 

jsfiddle