Как мне сделать рендеринг динамически сгенерированных тегов привязки в jquery Mobile? - PullRequest
Новая
       31

Как мне сделать рендеринг динамически сгенерированных тегов привязки в jquery Mobile?

5 голосов
/ 15 марта 2012

Я получаю HTML-код фрагмента привязки с сервера при вызове ajax. Как мне «обновить», чтобы jquery mobile мог добавлять необходимые классы к ссылкам?

Например, ссылка, сгенерированная jquery mobile, имеет ссылку ui: 

<a class="ui-link" href="http://www.google.com">http://www.google.com</a>

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

Ответы [ 2 ]

1 голос
/ 15 марта 2012

Если вы хотите обновить виджет, который уже был инициализирован, вы можете обновить каждый тип виджета, используя соответствующую функцию: 

$('.ui-btn').button('refresh');

Обратите внимание: я использовал класс .ui-btn для выбора элементов кнопки, этот класс добавляется после инициализации кнопки, поэтому вы можете быть уверены, что обновляете уже инициализированный виджет кнопки.

Документы: http://jquerymobile.com/demos/1.1.0-rc.1/docs/buttons/buttons-methods.html

Если вам нужно инициализировать виджет, который еще не инициализирован, то вы просто пропускаете 'refresh' или используете .trigger('create'): 

$('[data-role="button"], button, input[type="button"], input[type="submit"]').not('.ui-btn').button();//or .trigger('create');

Обратите внимание, здесь я опускаю уже инициализированные виджеты, используя .not('.ui-btn'), так что это будет только инициализировать неинициализированные виджеты. Если вы попытаетесь инициализировать виджет, который уже был инициализирован, вы получите сообщение об ошибке (то же самое, если вы попытаетесь обновить виджет, который еще не был инициализирован).

Обновление

Если ваш HTML выводится сервером, вы можете инициализировать виджеты перед добавлением их в DOM: 

$.ajax({
    ...
    success : function (serverResponse) {
        var $out = $(serverResponse);
        //if there is a container with elements inside it, use `.find()`,
        //if all the elements are siblings at the top level then use `.filter()`
        $out.find('a').button();
        $('body').append($out);
    }
});

Вы также можете использовать функцию .buttonMarkup() для обновления виджетов кнопок: http://jquerymobile.com/demos/1.1.0-rc.1/docs/buttons/buttons-options.html

0 голосов
/ 15 марта 2012

Вот как минимум один способ обновить стили для кнопок jQuery Mobile: 

$(yourButtons).button('refresh');

Документация: http://jquerymobile.com/test/docs/buttons/buttons-types.html

...