Question

我在将数据添加到Jquery Mobile上的非本机选择菜单时遇到问题。这是我的代码：

in html：

<select id="my-select" data-native-menu="false"></select>

在javascript中：

var len = results.rows.length;
var s = '';
for (var i=0; i<len; i++){
$('#my-select')
.html($("<option></option>")
.attr("value",results.rows.item(i).id)
.text(results.rows.item(i).name));
}

因此，如果我删除“ data-native-menu =”false“”，那么该代码可以完美运行。我的代码怎么了？

谢谢

Answer 1

每次更改selectmenu中的选项时，都需要告诉jQM刷新/重建小部件：

http://api.jquerymobile.com/selectmenu/#method-refresh

$('#my-select').selectmenu( "refresh", true );

FYI。通过在for循环中使用html（$（＆＃34;＆＃34;）...），您每次都会覆盖所有选项。相反，在循环之前使用.empty（）清除现有选项，并使用append（）添加新选项。

为了提高效率，请创建一个包含所有选项的字符串，并在循环后将它们附加到DOM：

var opts = '';
for (var i=0; i<len; i++){
    opts += '<option value="' + results.rows.item(i).id + '">' + results.rows.item(i).name + '</option>';
}
$('#my-select').empty().append(opts).selectmenu( "refresh", true );

Jquery-Mobile：将数据附加到非本机选择选项菜单

1 个答案: