使用特定顺序进行序列化

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