JQuery移动动态分区页面

JQuery Mobile Dynamic Div Pages

本文关键字：分区 动态 移动 JQuery      更新时间：2023-09-26

我是JQuery+JQuery mobile的新手。

我正试图创建动态div元素以用于样式设计。我从AJAX调用中提取JSON，将其放入无序列表，并将其包装到div中。AJAX+JSON工作得很好，但当我在脚本中创建div并将其附加到另一个div容器中时，它不起作用。我已经对此做了很多阅读，但我找到的解决方案似乎都不适用于div部分。

我已经将代码简化为以下内容：

HTML:

  <div data-role="page">
        <div data-role="header">
            <h1>Page Title</h1>
        </div><!-- /header -->
        <div id="someDiv" data-role="content"></div>
        <div id="anotherDiv"></div>
    </div>

JavaScript:

$(document).ready(function() {
    var newDiv = '<div id="d1"><p>This will attach to the content</p></div>';
    var aDiv = '<div id="test" data-role="page"><p>This never gets displayed because of data-role?</p></div>';
    $("#someDiv").html(newDiv).trigger('create');
    $("#anotherDiv").html(aDiv).trigger('create');
});​

注意aDiv如何不连接到anotherDiv。我怀疑这与aDiv中的data-role="page"属性有关。

JSFiddle链接

我已经被这个问题困扰了一天多了。非常感谢您的帮助！！

事实上，您的aDiv正在被附加，只是没有显示（您可以在Firebug/WebInspector/DragonFly中检查您的标记并查看此信息），因为一次只显示一个JQM页面。

如果你想附加一个新页面，你可以尝试将其添加到你的body 中

这是你的叉子

http://jsfiddle.net/49LgB/

相关文章：