文章/答案/技术大牛

发布

社区首页 >问答首页 >动态创建的Selectmenu选项使用第一个值覆盖选定的选项

问动态创建的Selectmenu选项使用第一个值覆盖选定的选项
EN

Stack Overflow用户

提问于 2013-06-14 20:42:09

回答 1查看 927关注 0票数 0

您好，我已经动态创建了选择菜单选项，以正确地填充下拉菜单。我的问题是，从下拉列表中选择任何选项(值)时，该值会被列表中的第一个值覆盖。

请参阅此小提琴以了解问题http://jsfiddle.net/praleedsuvarna/SwLNG/

我参考了之前的几篇文章，但没有一篇对我有很大帮助。

下面是供您参考的html代码。

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
</head>
<body>
<div data-role="page" id="checkout">
        <div data-id="commonHeader" data-role="header" data-position="fixed">
            <a href="#" rel="external" data-direction="reverse" data-rel="back" data-icon="back">Back</a>
            <h1>Checkout</h1>
        </div>
        <div data-role="content">
            <label for="state_o">State:</label>
            <select name="state_o" id="state_o" data-native-menu="false">
            </select>
        </div>
  <div data-theme="a" data-role="footer" data-position="fixed">

        </div>
    </div>   
</body>
</html>

以下是java脚本

$(document).on('pageshow', '#checkout', function(){  
    var stateList = "";
    stateList = stateList + '<option value="Maharashtra">Maharashtra</option>';
    stateList = stateList + '<option value="AP">AP</option>';
    stateList = stateList + '<option value="MP">MP</option>';
    stateList = stateList + '<option value="Delhi">Delhi</option>';
    stateList = stateList + '<option value="Goa">Goa</option>';
    stateList = stateList + '<option value="Karnataka">Karnataka</option>';
    stateList = stateList + '<option value="Gujarat">Gujrat</option>';
    stateList = stateList + '<option value="Assam">Assam</option>';
    stateList = stateList + '<option value="Bihar">Bihar</option>';
    stateList = stateList + '<option value="Haryana">Haryana</option>';
    stateList = stateList + '<option value="J&K">J&K</option>';
    stateList = stateList + '<option value="Kerala">Kerala</option>';
    stateList = stateList + '<option value="Odisha">Odisha</option>';
    $("#state_o").html(stateList);
    $("#state_o").selectmenu("refresh", true);
});

任何帮助都将不胜感激。

jquery

jquery-mobile

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-06-14 21:13:36

当您在select中选择了某项内容时，UI会自动返回到上一页，从而触发“pageShow事件”。这就是你的列表被重置的原因。

例如，您可以替换事件处理程序，因为您已经在"onDomReady“部分中。

替换

$(document).on('pageshow', '#checkout', function(){

通过

$(function(){

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/17108724

复制

相似问题

问动态创建的Selectmenu选项使用第一个值覆盖选定的选项
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态创建的Selectmenu选项使用第一个值覆盖选定的选项EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态创建的Selectmenu选项使用第一个值覆盖选定的选项
EN