Question

我在jquery mobile中有一个选择菜单，我想将它设置为本地存储，然后再从中获取值。如果用户选择汽车，它将能够从列表中删除汽车吗？

有谁知道如何做到这一点？

<div data-role="fieldcontain">
    <label for="select1">Choose a car to rent:</label>
    <select name="select1" id="select1" onchange="selectvalue(this.value);">
        <option value="97-113-13">Avenger </option>
        <option value="97-225-13">Caravan </option>
        <option value="97-112-13">Focus </option>
        <option value="97-119-13">Escape</option>
        <option value="97-226-13">E 350</option>
        <option value="97-227-13">Mustang</option>
        <option value=" 97-118-13">Wrangler</option>
        <option value="97-223-13">Grand Cherokee</option>
        <option value="97-111-13">Picanto</option>
        <option value="97-114-13">Galant</option>
        <option value="97-115-13">Altima</option>
        <option value="97-116-13">Juke</option>
        <option value="97-222-13">Corolla</option>
    </select>
</div>

Answer 1

<强> DEMO

    <div data-role="fieldcontain">
        <label for="selCar">Select car:</label>
        <select name="selCar" id="selCar">
            <option value="97-113-13">Avenger</option>
            <option value="97-225-13">Caravan</option>
            <option value="97-112-13">Focus</option>
            <option value="97-119-13">Escape</option>
            <option value="97-226-13">E 350</option>
            <option value="97-227-13">Mustang</option>
            <option value=" 97-118-13">Wrangler</option>
            <option value="97-223-13">Grand Cherokee</option>
            <option value="97-111-13">Picanto</option>
            <option value="97-114-13">Galant</option>
            <option value="97-115-13">Altima</option>
            <option value="97-116-13">Juke</option>
            <option value="97-222-13">Corolla</option>
        </select>
    </div>

每次提交表单时，从选择菜单中获取当前选定的值并将其保存到localStorage。每次创建页面时，请从localStorage中读取值，然后将其从选项列表中删除：

$(document).on("pagecreate", "#page1", function(){
     RemovePreviouslySelected();

    $("#btnSubmit").on("click", function(){
        var selVal = $("#selCar").val();
        localStorage.setItem("selectedCar", selVal);
    });
});

function RemovePreviouslySelected(){
    var prev = localStorage.getItem("selectedCar");
    if (prev){
        $("#selCar option").each(function(index){
            if ($(this).prop("value") == prev){
                $(this).remove();
                return;
            }
        });   
    }
}

如何在jquery mobile中将选择菜单设置为本地存储？

1 个答案: