单击时,JQuery选择多选选择框的所有选项

Question

这是我的HTML

<select name="countries" id="countries" MULTIPLE size="8">
   <option value="UK">UK</option>
   <option value="US">US</option>
   <option value="Canada">Canada</option>
   <option value="France">France</option>
   <option value="India">India</option>
   <option value="China">China</option>
</select>
<br />
<input type="button" id="select_all" name="select_all" value="Select All">

当用户点击"全选"按钮时,我希望选择选择框中的所有选项

$('#select_all').click( function() {
    // ?
});

Answer 1

试试这个:

$('#select_all').click(function() {
    $('#countries option').prop('selected', true);
});

这是一个现场演示.

Answer 2

对于jQuery版本1.6+然后

$('#select_all').click( function() {
    $('#countries option').prop('selected', true);
});

或者对于旧版本:

$('#select_all').click( function() {
    $('#countries option').attr('selected', 'selected');
});

现场演示