需要保存哪些复选框将显示为选项

时间:2012-12-04 07:55:00

标签: javascript jquery-mobile

我在页面上有这些复选框,而在另一个页面上我有这些相同的复选框。

            <div data-role="content" data-theme="a">    
        <h2>Kies categorieen</h2>
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <input type="checkbox" name="categorie-kijk" id="goedkoop-bier-kijk" class="custom" />
                <label for="goedkoop-bier-kijk">Goedkoop bier</label>
                <input type="checkbox" name="categorie-kijk" id="muziek-kijk" class="custom" />
                <label for="muziek-kijk">Muziek</label>
                <input type="checkbox" name="categorie-kijk" id="gezelligheid-kijk" class="custom" />
                <label for="gezelligheid-kijk">Gezelligheid</label>
            </fieldset>
        </div>
        <p><a href="#bekijken2" data-direction="reverse" data-role="button" data-theme="b">Toon</a></p> 

    </div>

现在我想保存下面页面的选中值,以影响上面页面的值。当用户单击下面的“Opslaan”按钮时,它应该保存选中的复选框,并仅显示上面页面中的复选框。 因此,例如,如果只检查并保存了带有“gezelligheid-fav”的复选框,则上面的页面只应显示“gezelligheid-kijk”复选框。

    <div data-role="content" data-theme="d">    
        <h2>Selecteer favorieten</h2>   
        <div data-role="fieldcontain">
            <fieldset data-role="controlgroup">
                <input type="checkbox" name="categorie-fav" id="goedkoop-bier-fav" class="custom" />
                <label for="goedkoop-bier-fav">Goedkoop bier</label>
                <input type="checkbox" name="categorie-fav" id="muziek-fav" class="custom" />
                <label for="muziek-fav">Muziek</label>
                <input type="checkbox" name="categorie-fav" id="gezelligheid-fav" class="custom" />
                <label for="gezelligheid-fav">Gezelligheid</label>
            </fieldset>
        </div>
        <p><a href="#instellingen" data-role="button" data-inline="true" data-icon="back">Opslaan</a></p>   
    </div>

有谁知道我应该怎么做?

1 个答案:

答案 0 :(得分:1)

假设两个组具有相同数量的复选框并且顺序相同, 使用jQuery,使用此处理程序绑定'Opslaan'按钮上的click事件:

function() {
    var cbxs1 = $('input[name="categorie-fav"]'),
        cbxs2 = $('input[name="categorie-kijk"]');
    cbxs1.each(function(index) {
        cbxs2[index].checked = this.checked;
    });
}