jQuery Mobile，在选项列表中选择所有项目

jQuery Mobile, Select All Items in an option list

本文关键字：选择 项目 列表 Mobile 选项 jQuery      更新时间：2023-09-26

好的，所以我在jQuery Mobile中选择多选中的所有项目时遇到了问题。

小提琴在这儿：http://jsfiddle.net/u41yk3fy/

HTML:

<div data-role="page" id="one">
    <div data-role="content">
        <label for="sel">Select the Options</label>
        <select name="sel" id="sel" data-native-menu="false" multiple="multiple">
            <option value="1">Prod 1</option>
            <option value="2">Prod 2</option>
            <option value="3">Prod 3</option>
            <option value="4">Prod 4</option>
            <option value="5">Prod 5</option>
            <option value="6">Prod 6</option>
        </select>
        <div class="floatright" data-role="controlgroup" data-type="horizontal">
            <a href="#" id="selectall" data-role="button" data-icon="plus">Select All</a>
            <a href="#" id="deselectall" data-role="button" data-icon="minus">Deselect All</a>
        </div>
    </div>
</div>

Javascript：

function selectAll(select) {
    if (select == false) {
        $("#sel option:selected").removeAttr("selected");
    } else {
        $("#sel option").attr("selected", "true");
    }
    $("#sel").selectmenu("refresh", true);
}
$(document).ready(function () { 
    $('#selectall').click(function (event) {
        return selectAll(true);
    });
    $('#deselectall').click(function (event) {
        return selectAll(false);
    });
});

基本上在Chrome、Opera和Safari上，这确实有效。使用IE和Firefox，如果您选择所有并取消选择所有，尝试再次选择所有将不再有效。我有一种感觉，这可能是jQuery、jQuery Mobile或Javascript的问题，而不是我做错了什么。然而，如果我做错了什么，我会感谢你的意见。

你可以试试这个：

function selectAll(select) {
    if (select == false) {
        $("#sel").val([]);
    } else {
        $("#sel option").prop("selected",  true);
    }
    $("#sel").selectmenu("refresh", true);
}

这是一个演示。

相关文章：