Question

我正在尝试将列表项添加到jquery mobile中的无序列表，但似乎没有正确创建格式。

<ul data-role="listview" data-theme="c" data-dividertheme="b">
                    <li data-role="list-divider">
                        Title Divider
                    </li>
                    <li>
                        <a href="test.html" data-transition="slide">List item 1</a>
                    </li>

 </ul>

脚本：

$('ul').append('<li><a>hello</a></li>');

由于某种原因，动态生成的li不会显示与静态创建的li相同的方式。有谁知道为什么以及如何让它变得一样？

Answer 1

试试这个：

$('ul').append($('<li/>', {    //here appending `<li>`
    'data-role': "list-divider"
}).append($('<a/>', {    //here appending `<a>` into `<li>`
    'href': 'test.html',
    'data-transition': 'slide',
    'text': 'hello'
})));

$('ul').listview('refresh');

Answer 2

提供的答案结果有点混乱......

$('ul').append('<li><a>hello</a></li>');没问题，但需要刷新列表视图，所以你只需要：

$('ul').append('<li><a>hello</a></li>').listview('refresh');

Answer 3

如果你想改变UL的属性，你可能不得不为封闭的div调用.trigger（'create'）。这可以确保在重置属性的情况下再次创建UL。

Answer 4

你的＆lt; a＆gt;标签未引用网页。

尝试：

$('ul').append('<li><a href="test2.html' data-transition="slide" />List Item 2</li>');

Answer 5

您必须在列表标记

中添加一个类

$('<ul>').append( $('<li>').attr('class','ui-li ui-li-static ui-btn-up-c ui-li-last').append('hello'))  ;

JQuery mobile会自动在列表项中添加一个类，如果您在firefox中运行页面并使用firebug进行调试，则可以看到该类。选择已应用的任何类，并将其添加到动态生成的li标签中。

在jquery mobile </ul> </li>中动态添加<li>到<ul>

5 个答案: