Динамическое добавление <li/ "> в <ul/" > в jquery mobile
Я пытаюсь добавить элементы списка в неупорядоченные списки в 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>
Script:
$('ul').append('<li><a>hello</a></li>');
По какой-то причине динамически генерируемый li не отображается так же, как тот, который статически создан. Кто-нибудь знает, почему и как я могу сделать то же самое?
Ответы
Ответ 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');
Ответ 2
Полученные ответы оказались немного грязными...
$('ul').append('<li><a>hello</a></li>');
в порядке, но ему нужно обновить список, поэтому все, что вам нужно, это:
$('ul').append('<li><a>hello</a></li>').listview('refresh');
Ответ 3
И если вы хотите изменить атрибуты UL, вам может потребоваться вызвать .trigger('create') для входящего div. это гарантирует, что UL будет создан снова со свойствами reset.
Ответ 4
Тег <a> не ссылается на веб-страницу.
попробовать:
$('ul').append('<li><a href="test2.html' data-transition="slide" />List Item 2</li>');
Ответ 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.