jQuery手机。(jQuery mobile. Dynamically filling Select menu. Option doesn't display initially)

我在动态填充jQuery Mobile中的选择菜单时遇到了问题。

当我添加选项时，初始值不显示，我只是得到一个空行。这些值在那里并且在点击菜单时可以选择，但它只是初始视图。当我将菜单硬编码到页面时，它工作正常。我会认为这是因为我最初有一个空的下拉列表，因为它应该和附加时显示，视图不知道更新，所以不断显示一个空行。无论如何，我可以强制视图更新后，我已经附加？我试过.trigger("create")但这没有做任何事情。

这是一个显示我的意思的屏幕。 “位置”下拉列表是我遇到的问题，“测试”是我用硬编码来显示我想实现的目标。

这里是HTML：

<label for="location" class="select">Location</label> <select name="location" id="location"></select> <label for="test" class="select">Test DD</label> <select name="test" id="test"> <option value="test1">Test 1</option> <option value="test2">Test 2</option> <option value="test3">Test 3</option> <option value="test4">Test 4</option> <option value="test5">Test 5</option> </select>

这里是JS：

tx.executeSql('SELECT * FROM locations WHERE lDeleted != 1', [], function(tx,results){ var len = results.rows.length; for (var i=0; i<len; i++){ $('#location').append('<option value="'+results.rows.item(i).ID+ '" class="dropDownBlk">'+results.rows.item(i).lTitle+'</option>'); } $('#location').append('<option value="0">Add new location...</option>') }, errorCB );

I am having issues with dynamically populating a select menu in jQuery mobile.

When I append the options, the initial value isn't shown and I just get a blank line. The values are there and selectable when clicking on the menu, but it is just the initial view. It works fine when I hardcode the menu into the page. I would assume it is because I initially have an empty dropdown which is showing as it should and when appending, the view doesn't know to update so keeps showing an empty line. Is there anyway I can force the view to update after I have appended? I've tried .trigger("create") but this does nothing.

Here is a screen showing what I mean. The "location" dropdown is the one I am having issue with and the "test" one is one I have hard coded to show what I am trying to achieve.

Here's the HTML:

<label for="location" class="select">Location</label> <select name="location" id="location"></select> <label for="test" class="select">Test DD</label> <select name="test" id="test"> <option value="test1">Test 1</option> <option value="test2">Test 2</option> <option value="test3">Test 3</option> <option value="test4">Test 4</option> <option value="test5">Test 5</option> </select>

And here's the JS:

tx.executeSql('SELECT * FROM locations WHERE lDeleted != 1', [], function(tx,results){ var len = results.rows.length; for (var i=0; i<len; i++){ $('#location').append('<option value="'+results.rows.item(i).ID+ '" class="dropDownBlk">'+results.rows.item(i).lTitle+'</option>'); } $('#location').append('<option value="0">Add new location...</option>') }, errorCB );