Question

您好我有一个id为'quote-area'的选择框，我想为其动态创建选项。

适用于使用jQuery mobile和HTML5的移动应用。

我有一个本地保存的区域表，我将它们拉出来并将它们放入for循环中构建一个html字符串，然后将其附加到选择框。

这是我的JS：

               function(tx, results) {
                    len = results.rows.length;

                    var markup = [];

                    for(var i=0; i< len; i++){

                        var area_id= results.rows.item(i).area_id;
                        var label = results.rows.item(i).label;

                        markup.push("<option value='"+area_id+"'>");
                        markup.push(label);
                        markup.push("</option>");
                    }
                    alert(markup.join(""));
                    $('#quote-area').append(markup.join(""));
                }
                );

HTML：

<select name="area" id="quote-area"></select>

我的警报运行，我可以看到标记已正确构建。但我的选择框没有任何反应。我已经检查了选择ID。

我想知道是不是因为首先加载了js文件，然后每个后续的html页面被ajax加入DOM（jQuery移动功能）。那么当下载javascipt时，选择框还不存在吗？

任何人都可以帮我吗？我需要使用某种直播活动吗？

更新

我也尝试使用实时查询插件，因为我几乎是肯定的，因为在加载脚本时列表不是DOM的一部分。但仍然没有运气。

 $('#quote-area').livequery(function(){
     $(this).append($("<option></option>").attr("value",area_id).text(label));
 });

Answer 1

你试过吗

$(document).ready(function() { whatever(); });

这应该使代码在页面加载后运行

Answer 2

如果要通过ajax请求在页面上放置目标选择框，则应在ajax onsuccess事件中执行代码。加载“静态”页面时会触发文档就绪事件，而不是在处理完所有ajax请求时触发。

Answer 3

使用JQM，您需要将其出价到页面事件AS PER：

重要提示：使用$（document）.bind（'pageinit'），而不是$（document）.ready（）

你在jQuery中学到的第一件事就是在$（document）.ready（）函数中调用代码，这样一旦加载了DOM，一切都会执行。但是，在jQuery Mobile中，Ajax用于在导航时将每个页面的内容加载到DOM中，而DOM ready处理程序仅针对第一个页面执行。要在加载和创建新页面时执行代码，您可以绑定到pageinit事件。此事件在本页底部详细说明。

链接到这里：http：//jquerymobile.com/demos/1.2.0/docs/api/events.html

似乎无法找到要追加的元素

3 个答案: