Question

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

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问题，而不是我做错了。但是，如果我做错了什么，我会很感激输入。

Answer 1

你可以试试这个：

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

    $("#sel").selectmenu("refresh", true);
}

这是Demo。

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

1 个答案: