jquerymobile 动态添加选择菜单

jquerymobile Add select menus dynamically

本文关键字:菜单 选择 添加 动态 jquerymobile      更新时间:2023-09-26

我有一组保管箱代码是

<fieldset data-role="controlgroup" data-type="horizontal">
    <!--<legend>&nbsp;</legend>-->
    <select name="select-widget" id="select-widget">
        <option value="Widget">Widget</option>
    </select>
    <select name="select-nbl" id="select-nbl">
        <option value="NBL">NBL</option>
        <option value="HSM">HSM</option>
        <option value="TERR">TERR</option>
        <option value="KEY_ACCOUNT">KEY ACCOUNT</option>
    </select>
    <select name="select-level-focus" id="select-level-focus">
        <option value="LEVEL">LEVEL</option>
        <option value="FOCUS">FOCUS</option>
    </select>
    <select name="select-wdg" id="select-wdg">
        <option value="WDG">WDG</option>
    </select>
    <select name="select-wds" id="select-wds">
        <option value="WDS">WDS</option>
    </select>
</fieldset>

不,我想删除 exixsting 选择框或在更改"选择-nbl"或"选择级别焦点"时向其添加新的选择框

如何使用jquerymobile做到这一点

这与jQuery mobile关系不大,这只是一个移动框架。你想在这里做的事件侦听器和 DOM 操作仍然由 jQuery 处理。

无论如何,你是怎么做到的?

好吧,你有你的事件侦听器:

$('#select-nbl').change(function() {
    #Do something
});

你可以隐藏东西:

$('#select-wdg').parents('.ui-select').hide();

使用parents()是为了照顾jQuery移动版放入的额外样式。

你不能轻易地将选择框添加到jQuery mobile,但如果它们是隐藏的,你可以显示它们。

$('#select-wdg').parents('.ui-select').show();

这一切都是行动:http://jsfiddle.net/luhn/Vgc4g/9/