2015-04-03 49 views
1

當用戶在選擇框內點擊OPTGROUP時,我想選擇OPTGROUP的所有子元素。但由於某種原因,我的代碼無法正常工作。 OPTGROUP上的點擊事件不會觸發。點擊OPTGROUP後選擇所有子元素

由於它是多選元素,我使用Bootstrap Multiselect plugin

這裏是我的代碼:

$("optgroup.opt_group").select(function(e) { 
    $(this).children().attr('selected', 'selected'); 
}); 

<select id="example19" multiple="multiple"> 
    <optgroup label="Mathematics" class="opt_group"> 
     <option value="analysis"> Analysis</option> 
     <option value="algebra">Linear Algebra</option> 
     <option value="discrete"> Discrete Mathematics</option> 
     <option value="numerical">Numerical Analysis</option> 
     <option value="probability"> Probability Theory </option> 
    </optgroup> 
    <optgroup label="Computer Science" class="opt_group"> 
     <option value="programming"> Introduction to Programming</option> 
     <option value="automata">Automata Theory</option> 
     <option value="complexity"> Complexity Theory</option> 
     <option value="software">Software Engineering</option> 
    </optgroup> 
</select> 
+0

這個問題可能脫落一些光:http://stackoverflow.com/questions/9892247/selectable-optgroup-in-html-select-tag – bloodyKnuckles 2015-04-03 12:54:53

+0

嘗試使用$(e.currentTarget).children()...而不是$(this).childr恩()...? – 2015-04-03 12:56:17

回答

1

那是因爲你沒有使用點擊事件試試這個:

$("optgroup.opt_group").click(function(e) { 

     $(this).children().attr('selected','selected'); 
    });