Question

使用JQM 1.4.5。我正在添加来自Web服务的结果，结果将添加到选择中。如果我从我的chrome控制台使用$("#statsSelect")，我可以看到添加到我的选择中的所有记录，但更改从未反映在页面上。如果我检查选择菜单所在的元素，那么只有原始选项。

目前我加载了html页面，然后我插入下面的select html，然后我为我的数据调用ajax，然后使用addStatsTemplate插入它。永远不会显示动态添加的选项。

加载下面的

Main.js文件，运行getAllUsersStats(ajax call)并传递addStatTemplates，这是下面的回调函数参考。

$('#statsPage').bind("pageshow",function(){ // When entering pagetwo
    /** Add the stats returned to the select tag **/
    loadStatsPage();
    getAllUsersStats(addStatTemplates);
});

我的功能是插入我的选择html

 var targetInsert = '[data-role=content]';
 insertStatsSelect(targetInsert);
 $.get('/forms/CreateStatsForm.html', function (retData) {
     $(targetInsert).append(retData).trigger('create');
 });

我的选择

<div class="ui-field-contain">
  <label for="statsSelect" class="select">Stats:</label>
  <select name="statsSelect" id="statsSelect">
    <option value="standard">Standard: 7 day</option>
    <option value="rush">Rush: 3 days</option>
    <option value="express">Express: next day</option>
    <option value="overnight">Overnight</option>
  </select>
</div>

将json数据添加到选择

的功能

/**
 * Add the returned stats to the select tag
 */
function addStatTemplates(data){
    var statsSelect = $('#statsSelect').selectmenu();
    $(statsSelect).empty();
    var f = false;
    $.each(data,function(i, v){
        var sheetname = v.sheetname;
        if(f === false){
            $(statsSelect).append($("<option>").attr("value", v.id).attr("selected", "selected").text(sheetname));
        } else {
            $(statsSelect).append($("<option>").attr("value", v.id).text(sheetname));
        }
        f = true;
    });
    $(statsSelect).selectmenu("refresh", true);
}

我尝试过的事情

像'<option value="'+id+'">'+sheetname+'</option>'
我尝试使用.html（）添加而不是追加
而不是var statsSelect = $('#statsSelect').selectmenu();我只使用了$('#statsSelect')
我尝试在插入后添加$(statsSelect).selectmenu();然后添加$(statsSelect).selectmenu("refresh", true);。我也在控制台中试过这些并且它不起作用
我已尝试$('#myPageID').trigger('create');重新创建页面

我知道这个问题已经陷入困境，但我似乎无法弄清楚为什么它没有显示

Answer 1

显然，正确定位选择菜单的唯一方法是使用

$("html #statsSelect");

将“html”放在id标记之前。否则，它将在DOM中的某处创建一个新的选择标记，并将其添加到可见标记但不显示结果。惊人...

JQueryMobile动态添加了未被反映的选项

1 个答案: