如何选择和取消选择选择框中的所有选项

use*_*090 9 html jquery

<select name="remaintextarea" id="studentremain" size="10">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
</select>

<button type='button' id='selectall'>Select All</button>
<button type='button' id='deselectall'>De-Select All</button>
Run Code Online (Sandbox Code Playgroud)

上面有一个选择框,选择全部并取消选择上面的所有按钮.我的问题是使用jquery,如何点击相关按钮时,如何让按钮选择所有选项并取消选择上面选择框中的所有选项?

下面我只有两个按钮的点击处理程序:

$('#selectall').click(function() {

});   

$('#deselectall').click(function() {

});
Run Code Online (Sandbox Code Playgroud)

Ton*_*Day 24

您需要将multiple属性添加到select元素,然后您可以:

$('#selectall').click(function() {
    $('select#studentremain option').attr("selected","selected");
});   

$('#deselectall').click(function() {
    $('select#studentremain option').removeAttr("selected");
});
Run Code Online (Sandbox Code Playgroud)

  • @dreamweiver。我遇到了与您相同的问题,并使用[.prop](/sf/ask/4080826081/?noredirect=1#comment102959007_58297559)解决了该问题。我知道已经晚了5年,但我希望该链接将来能对某人有所帮助。 (2认同)

phn*_*kha 8

试试这个演示

必须在select元素中添加multiple ="multiple"

HTML:

<select multiple="multiple" name="remaintextarea" id="studentremain" size="10">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
</select>
<button type='button' id='selectall'>Select All</button>
<button type='button' id='deselectall'>De-Select All</button>
Run Code Online (Sandbox Code Playgroud)

JS:

$('#selectall').click(function() {
    $('#studentremain > option').attr("selected", "selected");
});   

$('#deselectall').click(function() {
    $('#studentremain > option').removeAttr("selected");
});
Run Code Online (Sandbox Code Playgroud)