所选项目未显示在jquery mobile select - nativedroid中

Question

即使我在选择列表中选择了一个项目，它也不会出现在选择框中。

请在下面找到我的css代码：

    <li class="ui-field-contain ui-li-static ui-body-inherit" data-role="fieldcontain">
<label for="select-choice-1b" class="select">Type:</label>
     <div class="ui-select">
    <div class="ui-btn ui-icon-carat-d ui-btn-icon-right ui-corner-all ui-shadow">
    <select len="50" calculated="false" related_module="" required="" id_name="" group="" type="enum" name="account_type" data-native-menu="false">
    <option value=""></option>
    <option value="Analyst">Analyst</option>
    <option value="Competitor">Competitor</option>
    <option value="Customer">Customer</option>
    <option value="Integrator">Integrator</option>
    <option value="Investor">Investor</option>
    <option value="Partner">Partner</option>
    <option value="Press">Press</option>
    <option value="Prospect">Prospect</option>
    <option value="Reseller">Reseller</option>
    <option value="Other">Other</option>
    </select>
    </div>
    </div>
    </li>

请帮助我是jquery mobile的新手。

Answer 1

不要自己注入jQM CSS，只需添加常规HTML标记，然后在包含DOM元素上调用 .enhanceWithin() ，以强制jQM添加所有样式和功能。

鉴于此页面标记：

<div data-role="page" id="page1">
     <div data-role="header">
        <h1>My page</h1> 
    </div>  
    <div role="main" class="ui-content">
        <div id="container"></div>
    </div>  
</div>  

以下脚本将在第一个listitem中动态添加带有选择框的列表视图：

var dyn = '<ul data-role="listview"><li><select name="account_type" id="account_type" data-native-menu="false"><option value=""></option><option value="Analyst">Analyst</option><option value="Competitor">Competitor</option><option value="Customer">Customer</option><option value="Integrator">Integrator</option><option value="Investor">Investor</option><option value="Partner">Partner</option><option value="Press">Press</option><option value="Prospect">Prospect</option><option value="Reseller">Reseller</option><option value="Other">Other</option></select></li></ul>';

$("#container").empty().append(dyn).enhanceWithin();

  

这是 DEMO