Не могу найти элемент для добавления

Question

Привет, у меня есть поле выбора с идентификатором '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-страница направляется в DOM (мобильная функциональность jQuery). Так, когда javascipt загружен, окно выбора еще не существует?

Может кто-нибудь помочь мне с этим? Нужно ли использовать какое-то живое событие?

UPDATE:

Я также пытался использовать плагин live query, потому что я почти уверен, что этот список не является частью DOM при загрузке скрипта. Но все равно не повезло.

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

Answer 1

Вы пробовали

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

Это должно заставить код работать после загрузки страницы

Answer 2

С JQM вам необходимо выставить ставку на события на странице КАК:

Внимание! Используйте $ (document) .bind ('pageinit'), а не $ (document) .ready ()

Первое, чему вы научитесь в jQuery, это вызвать код внутри функции $ (document) .ready (), чтобы все выполнялось, как только DOM загружен. Однако в jQuery Mobile Ajax используется для загрузки содержимого каждой страницы в DOM во время навигации, а обработчик готовности DOM выполняется только для первой страницы. Чтобы выполнить код всякий раз, когда новая страница загружается и создается, вы можете привязаться к событию pageinit. Это событие подробно объясняется внизу этой страницы.

Ссылка здесь: http://jquerymobile.com/demos/1.2.0/docs/api/events.html

Answer 3

Если вы помещаете целевое поле выбора на страницу с помощью запроса ajax, вы должны выполнить свой код в событии ajax onsuccess. событие готовности документа вызывается при загрузке «статической» страницы, а не при обработке всех запросов ajax.