Динамически создавать виджеты в DOM

Question

Я использую jQuery mobile 1 alpha 1.

Чтобы создать текстовый ввод, например, в jQuery mobile, вы добавляете в свой HTML

<div data-role='fieldcontain'>
<label for='name'>Text Input:</label>
<input type='text' name='name' id='name' value=''  />
</div>

Предположим, что вы присваиваете приведенный выше HTML-код переменной $textinput и набираете $("#someid").append($textinput);, тогда проблема заключается в том, что текстовый ввод появляется, но не имеет тематической формы. Я предполагаю, что некоторые Javascript запускаются при загрузке страницы, что добавляет правильные классы для целей CSS. Этот Javascript не запускается, когда я добавляю HTML-код непосредственно в DOM.

Что мне делать, чтобы корректный Javascript запускался при динамическом добавлении виджетов в мой DOM?

Answer 1

При добавлении времени выполнения экземпляра ввода укажите id вашего div, чтобы его можно было поймать на $ Создайте свой купол, как показано ниже

<div data-role='fieldcontain' id="field1">

Ввод текста:

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

$ ( "# field1") fieldcontain (). $ ( "# Имя") TextInput ();.

Answer 2

Взгляните на Live Query .

Live Query (formerly Behavior) utilizes the power of jQuery selectors
by binding events or firing callbacks or matched elements auto-magically,
even after the page has been loaded and the DOM updated.