Question

这里我定义了应用程序的代码和屏幕截图。图1（我的应用程序） - 这是我的应用程序的输出。我想在选择菜单中显示所选的选项。

图片2（我的应用程序） - 当我点击任何选择选项菜单时，它就像这样。但我想将位置设置为选中。

图片3（需要这个） - 我需要这种类型的应用程序输出。

当我使用本地网络服务时，我得到与图像-3相同的输出。但是当我在线使用网络服务或从网站获得与图像1和图像2相同的输出时。

enter image description here

<body>
<div id="menu">
<h3>Menu</h3>
    <ul>
        <li class="active"><a href="home.html?l=0=c=0=d=0=t=1=dc=1" class="contentLink" target="_self">Home </a></li>
        <li class="none"><a href="myreservations.html" target="_self" class="contentLink">My Reservations</a></li>
        <li class="none"><a href="#" target="_self" class="contentLink">Credit Points</a></li>
        <li class="none"><a href="myprofile.html" target="_self" class="contentLink">My Account</a></li>
        <li class="none"><a href="aboutus.html" target="_self" class="contentLink">About Us</a></li>
        <li class="none"><a href="contactus.html" target="_self" class="contentLink">Contact Us</a></li>
        <li class="none"><a href="#" class="contentLink" id="Logoutbutton" name="Logoutbutton">Logout</a></li>
    </ul>
</div>

<div data-role="page" id="home" class="pages" data-theme="c">
<div data-role="header">
    <a href="#"class="showMenu" id="showMenu"></a>
    <a id="selectcity" style="line-height:18px;"><select name="selectcity_menu" id="selectcity_menu" data-native-menu="true" data-theme="c" >
        </select></a>            
    <a id="directlogin">LogIn</a>
        <h1></h1>
    </div><!-- /header -->

    <div data-role="footer">        
    <div data-role="navbar">
        <ul>
            <li><a href="home.html?l=0=c=0=d=0=t=1=dc=1" id="Restaurant" target="_self">Restaurant</a></li>
            <li><a href="home.html?l=0=c=0=d=0=t=2=dc=1" id="Lounge" target="_self">Lounge</a></li>
            <li><a href="home.html?l=0=c=0=d=0=t=3=dc=1" id="Banquet" target="_self">Banquet</a></li>
            <li><a href="home.html?l=0=c=0=d=0=t=4=dc=1" id="Event" target="_self">Event</a></li>           
        </ul>
    </div><!-- /navbar -->
    </div><!-- /footer -->

    <div data-role="content" align="center">
        <!--<input type="text" id="userstatus" name="userstatus"/>-->       

        <div class="ui-grid-a">
            <div class="ui-block-a">
                <div id="notation" style="width:100%;line-height:15px;padding:0px;">    
                <!--<label for="select-choice-0" class="select" ><h2> Locations </h2></label>-->
                <select name="note_utilisateur1" id="note_utilisateur1" data-native-menu="true" data-theme="c">
                </select>

                </div>
            </div>
            <div class="ui-block-b">
                <div id="notation" style="width:100%;line-height:15px;padding:0px;">    
                <!--<label for="select-choice-0" class="select"><h2> Cuisine </h2></label>-->
                <select name="note_utilisateur2" id="note_utilisateur2" data-native-menu="true" data-theme="c">
                </select>                   
                </div>            
            </div>                
        </div>

        <div class="ui-grid-a">
            <div class="ui-block-a">
                <div id="notation" style="width:100%;line-height:15px;padding:0px;">    
            <!--<label for="select-choice-0" class="select"><h2> Discount </h2></label>-->
                <select name="note_utilisateur3" id="note_utilisateur3" data-native-menu="true" data-theme="c">
                </select>                   
                </div>
            </div>
            <div class="ui-block-b">
                <a data-role="button" style="width:94%;line-height:15px;padding:0px;" id="clearall">Clear All</a>
            </div>                
        </div>        

        <hr />

        <br />

        <div id="restaurantlist">
        </div>       
    </div>
</div>
</body>

从网络服务动态生成的所有下拉菜单选项。

Answer 1

这有用吗？

http://jsfiddle.net/kGanA/

以下是jQM文档：

http://jquerymobile.com/demos/1.2.0/docs/forms/selects/methods.html

JS

// dummy options
var optionList = '<option value="1">Location 1</option><option value="2">Location 2</option><option value="3">Location 3</option>';

var myselect = $('#note_utilisateur3');

myselect.html(optionList); // adding the dummy options
myselect[0].selectedIndex = 2; // selecting the 2nd index ( remeber they start at zero )
myselect.selectmenu('refresh', true); // http://jquerymobile.com/demos/1.2.0/docs/forms/selects/methods.html

使用您问题中的html

Jquery移动选择菜单选项集动态生成但未设置选定选项

1 个答案: