2012-01-23 3 views
1

В моем JQuery мобильных приложений, я создаю некоторые динамические pages.Here это кодПрикрепления обработчики событий для динамически создаваемых страниц JQuery Mobile

function createPages() 
{ 
    $header = "<header data-role='header'><h1>Dynamically created pages</h1></header>"; 
    $content = "<div data-role='content' class='content'><p>This is a dynamically generated page</p></div>"; 
    $footer = "<div data-role='footer'><h1>Audimax</h1></footer>"; 

    for($i=1;$i<=5;$i++) 
    { 
     $section= "<section id='"+"#fav"+$i+"' data-role='page' data-url='"+"fav"+$i+"' class='dynamic'>"; 
     $new_page = $($section+$header+$content+$footer+"</section>"); 
     $new_page.appendTo($.mobile.pageContainer); 

    } 
} 

Страница создается правильно и добавляется в DOM и I может перейти к ним. Проблема в том, что я просто не могу подключить любые обработчики событий к динамическим страницам. Я использую идентификаторы динамических страниц с jquery «live», но безрезультатно. Любая помощь очень ценится.

+0

Можете ли вы опубликовать код, в котором вы хотите прикрепить событие и позвонить? – Abhi

+0

Где вы javascript-код на? на каждой новой динамической странице? или загруженной страницы (где это должно быть)? http://jsfiddle.net или, например, ссылка link/code тоже будет –

ответ

1

Почему бы не связать обработчики событий при добавлении новой псевдо-страницы в DOM?

function pageShowFunction() { 
    console.log(this.id + ' has triggered the `pageShow` event!'); 
} 
function createPages() 
{ 
    $header = "..."; 
    $content = "..."; 
    $footer = "..."; 

    for($i=1;$i<=5;$i++) 
    { 
     $section= "<section id='"+"#fav"+$i+"' data-role='page' data-url='"+"fav"+$i+"' class='dynamic'>"; 
     $new_page = $($section+$header+$content+$footer+"</section>").bind('pageshow', pageShowFunction); 
     $new_page.appendTo($.mobile.pageContainer); 

    } 
} 

Обычно лучше связывать непосредственно с элементами, а не делегировать обработку событий.

P.S. Вы не опубликовали свой код привязки к событию, поэтому я не могу дать никаких конкретных комментариев к этому коду, возможно, вы можете обновить свой вопрос с помощью этого кода, если это не решит вашу проблему.

+1

Динамические страницы имеют идентификаторы # fav1, # fav2, # fav3 и т. д. Существует только один файл js, и все делается в нем. Я пытаюсь . для подключения обработчиков событий к каждой странице, просто как: $ ("# fav1") жить ("кран", функция (событие, щ) { \t console.log ("обработчик клик работает"); \t }); – user1107888

+0

Спасибо Джаспер, ваше предложение привязки обработчиков непосредственно при динамическом создании страниц работает. – user1107888

+0

Любое предложение о том, как действовать при изменении некоторой разметки на динамически сгенерированных страницах? Стандартный подход с использованием идентификаторов, упомянутых выше: $ ("# fav1 ul"). Append ("") не работает – user1107888

1

Обновление ядра Jquery 1.7.1 от http://jquery.com/download/

, а затем

$(selector).live(eventName, function(){}); 

Может быть заменен следующим на подпись

$(document).on(eventName, selector, function(){}); 

Затем работает для динамических элементов.

Смежные вопросы