jquerymobile 动态添加选择菜单

Question

我有一组保管箱 代码是

<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>

不，我想在“select-nbl”或“select-levelfocus”更改时删除现有的选择框或添加新的选择框

如何使用 jquerymobile 做到这一点

Answer 1

这与 jQuery mobile 没有什么关系，它只是一个移动框架。你在这里要做的事件监听器和 DOM 操作仍然由 jQuery 处理。

不管怎样，你是怎么做到的？

嗯，你有你的事件监听器：

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

你可以隐藏东西：

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

使用 parents() 是为了处理 jQuery mobile 放入的额外样式。

您无法轻松地将选择框添加到 jQuery mobile，但如果它们被隐藏，您可以显示它们。

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

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