Получить детей после добавления JQuery Mobile? - PullRequest
Новая
       0

Получить детей после добавления JQuery Mobile?

1 голос
/ 09 сентября 2011

У меня есть пустой список в начале, как это. 

<ul id="list" data-role="listview" data-inset="true">
            </ul>

В функции готовности документа я вызываю несколько 

$('#list').append('<li id="a">A</li>').listview('refresh');

для ul, каждый из которых имеет свой уникальный идентификатор. Таким образом, результат должен быть таким: 

 <ul id="list" data-role="listview" data-inset="true">
      <li id="a">A</li>
      <li id="b">B</li>
 </ul>

Но в конце тега body в HTML, когда я пытаюсь сделать что-то вроде 

 $('#list').children()

Это выглядит как пустой набор []. Аналогично, когда я прикрепляю событие click с чем-то вроде $("#a").click(function{alert("A")}), оно вообще не работает, поскольку не распознает #a, поскольку оно было создано динамически, может быть?

Я надеюсь, что кто-то может помочь мне с тем, что происходит, и если есть способ обойти это.

Ответы [ 4 ]

1 голос
/ 09 сентября 2011

вам нужно использовать живую функцию jquery для привязки событий к добавленным данным. Попробуйте это. 

$("#a").live('click',function(){
alert("A");
});
0 голосов
/ 09 сентября 2011

Вы можете сделать это: 

<script type="text/javascript" src="jquery-1.6.3.min.js"></script>
<script>
$(document).ready(function(){
    $('#list').append('<li id="a">A</li>')
    .append('<li id="b">B</li>')
    .append('<li id="c">C</li>'); 
});
</script>
<ul id="list" data-role="listview" data-inset="true"></ul>
<script>
setTimeout(function(){
    $('#list').children("li").each(function(){
        alert($(this).attr("id"));
    });
},100);
</script>

setTimeout это то, что заставляет его работать

0 голосов
/ 09 сентября 2011

При использовании мобильного телефона jQuery вы не можете использовать обработчик документов, как обычно. Поскольку страницы вводятся с помощью ajax, обработчик готовности документа запускается только один раз (на какую страницу пользователь попадает первым). Вместо этого вы должны привязаться к событию pagecreate ( events ).

Кроме того, как уже упоминалось, вам нужно будет использовать live для обработки событий щелчка для динамически добавляемого контента.

0 голосов
/ 09 сентября 2011

Не знаю насчет детей. Звучит странно.

Событие click происходит потому, что элементы были созданы динамически, да.

Итак, чтобы обойти это, добавьте класс к каждому из предметов. 

<li id="a" class="ListItem">A</li>

Затем вы можете использовать каждое ключевое слово для перехода по списку.

Что касается события клика, используйте ключевое слово live. 

$(".ListItem").live("click", function() { your code here })
...