Улучшите этот jQuery?

Question

интересовался, может ли кто-нибудь помочь мне улучшить мой код. Его просто некоторые базовые варианты выбора флажка, но я знаю, что должны быть какие-то более короткие способы делать вещи.

The JQuery:

$(document).ready(function() { 
       $(".sendType").click(function() { 
        var what_is = $(this).attr("name"); 
        var p = new RegExp('.*?(\\d+).*?((?:[a-z][a-z]+))',["i"]); 
        var m = p.exec(what_is); 
        if (m != null) { 
         check_all(m[1], m[2], (this).checked); 
        } 
       }); 
       $(".controlType").click(function() { 
        var what_is = $(this).attr("name"); 
        check_all(0, what_is, (this).checked); 
       }); 
       function check_all(id, what, check) { 
        all = $("input:checkbox"); 
        sa = $("input:checkbox.sendType."+id); 
        sac = $("input:checkbox:checked.sendType."+id).length; 
        sw = $("input:checkbox.sendType."+what); 
        if (id == 0) { 
         if (what == 'all') { 
          all.attr('checked', check); 
         } else { 
          sw.attr('checked', check); 
         } 
        } 
        if (what == 'all') { 
         sa.attr('checked', check); 
        } else { 
         if (sac == 2) { 
          if (check === true) { 
           sa.attr('checked', true); 
          } else { 
           $("input:checkbox.sendType.all."+id).attr('checked', false); 
          } 
         } 
        } 
        ce = $("input:checkbox.controlType.email"); 
        ct = $("input:checkbox.controlType.text"); 
        s2 = $("input:checkbox:not(:checked).sendType.email").length; 
        s3 = $("input:checkbox:not(:checked).sendType.text").length; 
        if (!s2) { 
         ce.attr('checked', true); 
        } else { 
         ce.attr('checked', false); 
        } 
        if (!s3) { 
         ct.attr('checked', true); 
        } else { 
         ct.attr('checked', false); 
        } 
        if (!s3 && !s2) { 
         all.attr('checked', true); 
        } else { 
         $("input:checkbox.controlType.all").attr('checked', false); 
        } 
       } 
      }); 

Разметка:

<ul class="form-section"> 
    <li class="form-line"> 
    <input type="checkbox" class="controlType all" name="all" value="1"> 
     <input type="checkbox" class="controlType email" name="email" value="1"> 
     <input type="checkbox" class="controlType text" name="text" value="1"> 
    </li> 
    <li class="form-line"> 
    <input type="checkbox" class="sendType all 1" name="id[1][all]" value="Charlie Gery allen"> 
     <input type="checkbox" class="sendType email 1" name="id[1][email]" value="gery@live.com"> 
     <input type="checkbox" class="sendType text 1" name="id[1][text]" value="0412345678"> 
     <span id="id[1][name]">Charlie Gery allen</span> 
    </li> 
    <li class="form-line"> 
    <input type="checkbox" class="sendType all 6" name="id[6][all]" value="ye ere ertert"> 
     <input type="checkbox" class="sendType email 6" name="id[6][email]" value="blah@sdfsd.oer"> 
     <input type="checkbox" class="sendType text 6" name="id[6][text]" value="0415698721"> 
     <span id="id[6][name]">ye ere ertert</span> 
    </li> 
    <li class="form-line"> 
    <input type="checkbox" class="sendType all 7" name="id[7][all]" value="erterert utrtuuy 67678"> 
     <input type="checkbox" class="sendType email 7" name="id[7][email]" value="gggglll@mothing.com"> 
     <input type="checkbox" class="sendType text 7" name="id[7][text]" value="0598746248"> 
     <span id="id[7][name]">erterert utrtuuy 67678</span> 
    </li> 
    <li class="form-line"> 
    <input type="checkbox" class="sendType all 8" name="id[8][all]" value="rrrrrrtyertertrrrrrr yyyyyyyetryeyyyyyyy"> 
     <input type="checkbox" class="sendType email 8" name="id[8][email]" value=""> 
     <input type="checkbox" class="sendType text 8" name="id[8][text]" value=""> 
     <span id="id[8][name]">rrrrrrtyertertrrrrrr yyyyyyyetryeyyyyyyy</span> 
    </li> 
    <li class="form-line" id="id_2"> 
    <button id="input_2" type="submit" class="form-submit-button">Send Message</button> 
    </li> 
</ul> 

Если кто-то может получить к нему, благодаря куч.

Приветствия Charlie

Answer 1

Я взял на себя смелость оптимизации как кода JS и ваш HTML. (До некоторой степени)

Проверьте это здесь: http://jsfiddle.net/dominicbarnes/ybGbU/

HTML

Вы заметите, что я удалил некоторые классы ("ID" классы, controlType и sendType в частности) и добавлены некоторые идентификаторы (contact и control-line).

<ul id="contact" class="form-section"> 
    <li>All Email Text</li> 
    <li id="control-line" class="form-line"> 
     <input type="checkbox" class="all" name="all" value="1"> 
     <input type="checkbox" class="email" name="email" value="1"> 
     <input type="checkbox" class="text" name="text" value="1"> 
    </li> 
    <li class="form-line"> 
     <input type="checkbox" class="all" name="id[1][all]" value="Charlie Gery allen"> 
     <input type="checkbox" class="email" name="id[1][email]" value="gery@live.com"> 
     <input type="checkbox" class="text" name="id[1][text]" value="0412345678"> 
     <span id="id[1][name]">Charlie Gery allen</span> 
    </li> 
    <li class="form-line"> 
     <input type="checkbox" class="all" name="id[6][all]" value="ye ere ertert"> 
     <input type="checkbox" class="email" name="id[6][email]" value="blah@sdfsd.oer"> 
     <input type="checkbox" class="text" name="id[6][text]" value="0415698721"> 
     <span id="id[6][name]">ye ere ertert</span> 
    </li> 
    <li class="form-line"> 
     <input type="checkbox" class="all" name="id[7][all]" value="erterert utrtuuy 67678"> 
     <input type="checkbox" class="email" name="id[7][email]" value="gggglll@mothing.com"> 
     <input type="checkbox" class="text" name="id[7][text]" value="0598746248"> 
     <span id="id[7][name]">erterert utrtuuy 67678</span> 
    </li> 
    <li class="form-line"> 
     <input type="checkbox" class="all" name="id[8][all]" value="rrrrrrtyertertrrrrrr yyyyyyyetryeyyyyyyy"> 
     <input type="checkbox" class="email" name="id[8][email]" value=""> 
     <input type="checkbox" class="text" name="id[8][text]" value=""> 
     <span id="id[8][name]">rrrrrrtyertertrrrrrr yyyyyyyetryeyyyyyyy</span> 
    </li> 
    <li class="form-line" id="id_2"> 
     <button id="input_2" type="submit" class="form-submit-button">Send Message</button> 
    </li> 
</ul> 

JavaScript

Я полностью переписал эту часть здесь, а также включены комментарии!

$(document).ready(function() { 
    // get and store a list of all the "non-control" checkboxes 
    // ie, look in #contact for any checkbox not within #control-line 
    var $checkboxes = $("#contact").find("li.form-line:not(#control-line) input:checkbox"); 

    // now we'll enable the "control" checkboxes 
    $("#control-line input:checkbox").change(function() { 
     // if the selected control box has the "all" class 
     if ($(this).hasClass("all")) { 
      // then set all the "non-control" checkboxes to the same state as this one 
      $checkboxes.attr("checked", this.checked); 
      // as well as the sibling checkboxes (email and text) 
      $(this).siblings("input:checkbox").attr("checked", this.checked); 
     } else { 
      // otherwise, we only want to select a specific column, so we take the current className 
      // (this will break if you add any classes here, you could use a data-* attribute instead 
      $checkboxes.filter("." + this.className).attr("checked", this.checked); 
     } 
    }); 

    // now let's attach a specific event to the "all" checkboxes 
    // we'll start with our cached collection from above, then filter it to find only `.all` 
    $checkboxes.filter(".all").change(function() { 
     // set all the checkbox siblings to the state of the current checkbox 
     $(this).siblings("input:checkbox").attr("checked", this.checked); 
    }); 
});