js/jQuery如何将复选框值分配给div

Question

我正在使用Eric Hynds jQuery MultiSelect Widget从javascript文件填充。问题是这两种选择都会增加双方。选项1-3只能添加到Main1-3，对于选项/ Main 4-6也是如此。请参阅我的它是如何工作小提琴和问题http://jsfiddle.net/3u7Xj/112/

我认为这将是eaisiest打破它像

var lbl = $("#MDCselect").val(); 
     if (number1.checked) {... 
      ('.holder').append... 

var lbl2 = $("#ClinicalSelect").val(); 
      if (number2.checked) {... 
       ('.holder2').append... 

目前

$(document).ready(function() { 
    $(".multiselect").multiselect({ 
     header: "Choose up to 5 areas total", 
     click: function (event, ui) { 
      var number1 = $("#MDCselect").children(":checked").length, 
       number2 = $("#Clinicalselect").children(":checked").length; 

      if (ui.checked && ((number1 + number2 >= 5) || $(this).children(":checked").length >= 5)) { 
       return false; 
      } 

      var lbl = ui.value; 
      if (ui.checked) { 
       var ctrl = '<input type="checkbox" name="chk" checked="checked" class="chk" id="' + lbl.replace(/[^a-z0-9\s]/gi, '').replace(/[,\s]/g, '') + '">'; 
       $("[id^=id]:checked").each(function() { 
        $(this).nextAll('.holder:first').append('<div>' + ctrl + lbl + '</div>'); 
       }); 
      } else { 
       $("[id^=id]:checked").each(function() { 
        $(this).nextAll('.holder:first').find('#' + lbl.replace(/[^a-z0-9\s]/gi, '').replace(/[,\s]/g, '')).parent().remove(); 
       }) 
      } 
     }, 
     selectedList: 5 
    }); 
    $(".checkers").click(function() { 
     if (!$(this).is(':checked')) { 
      $(this).nextAll('.holder:eq(0)').find('div input').parent().remove(); 
     } else { 
      var checkedOnes = $('#MDCselect').nextAll('.ui-multiselect-menu').find('ul li input:checked'); 
      $(".holder").html(""); 
      for (var i = 0; i < checkedOnes.length; i++) { 
       var lbl = checkedOnes.eq(i).attr('value'); 
       var ctrl = '<input type="checkbox" name="chk" checked="checked" class="chk" id="' + lbl.replace(/[^a-z0-9\s]/gi, '').replace(/[,\s]/g, '') + '">'; 
       $("[id^=id]:checked").each(function() { 
        $(this).nextAll('.holder:first').append('<div>' + ctrl + lbl + '</div>'); 
       }); 
      } 
     } 
    }); 
}); 

Answer 1

我不能，如果完全确定我得到你想要做的，试试这个，让我知道这是否是你想要的是什么，这里是小提琴，如果你想尝试一下http://jsfiddle.net/8xBcd/

我把包含div的主电源，这样更容易为不同电源选择器。请检查小提琴。

<div id="main1-3" > 
<input type="checkbox" name="chk1" value="Main1" id="id1" class='checkers'/><label for="Main1"><b>Main1</b></label> 
<div class="holder"></div> 
</br> 
    <input type="checkbox" name="chk2" value="Main2" id="id2" class='checkers'><label for="Main2"><b> Main2</b></label> 
<div class="holder"></div> 
</br> 
     <input type="checkbox" name="chk3" value="Main3" id="id3" class='checkers'><label for="Main3"><b> Main3</b></label> 
<div class="holder"></div> 
</div> 

<select id="MDCselect" multiple="multiple" class="multiselect"> 
    <option>1</option> 
    <option>2</option> 
    <option>3, this space</option> 
</select><br>