JQuery Mobile, живой («pageinit», метод() для данных-темы

Question

В моей сноске, я написал эту функцию ...

jQuery('#page').live('pageinit', function() { 
$('.widget ul').attr('data-inset', 'true'); 
$('.widget ul').attr('data-theme', 'd'); 
$('.widget ul').attr('data-dividertheme', 'b'); 
$('.widget ul').attr('data-role', 'listview'); 
$('.widget ul').listview(); 
$('a.post-edit-link').attr('data-inline', 'true'); 
$('a.post-edit-link').attr('data-role', 'button'); 
$('a.post-edit-link').button(); 
$('#commentform').attr('data-theme', 'e'); ... 

Итак, как применять данные-тему на последней строке Что такое метод, как «кнопки» «ListView» или

Я также задаюсь вопросом, как применить "виджет Ульянова к первому атрибуту ...

$ (» виджет ул:. первый ')

не работает.

Благодарим за помощь!

С уважением,

В.

Answer 1

.widget ul:first будет выбрать первый ul элемент, который является потомком .widget элемента. Если вы хотите выбрать первый элемент списка в ul, вам необходимо: .widget ul li:first.

Формы сами не инициализируются jQuery Mobile, поэтому вместо таргетинга на форму вам нужно настроить таргетинг на отдельные виджеты ввода и инициализировать их.

Чтобы инициализировать кучу элементов, которые вы можете выбрать их все и вызовите .trigger('create') на них:

$('#commentform').find('input, textarea').trigger('create'); 

Это становится немного сложнее, когда вы хотите обновить виджеты, а не их инициализации:

$('#commentform').find('input[data-type="slider"]').slider('refresh').end() 
       .find('input[type="text]').textinput('refresh').end() 
       .find('input[type="checkbox"], input[type="radio"]').checkboxradio('refresh'); 

Также вы можете оптимизировать свой код путем цепочки вызовов функций, а не повторного выбора одного и того же элемента (ов) несколько раз:

$('.widget ul').attr('data-inset', 'true') 
       .attr('data-theme', 'd') 
       .attr('data-dividertheme', 'b') 
       .attr('data-role', 'listview') 
       .listview(); 

$('a.post-edit-link').attr('data-inline', 'true') 
        .attr('data-role', 'button') 
        .button(); 

Или вы можете передать объект в .attr() установить все атрибуты в одном вызове функции:

$('.widget ul').attr({ 
        'data-inset'  : true, 
        'data-theme'  : 'd', 
        'data-dividertheme' : 'b', 
        'data-role'   : 'listview' 
       }).listview(); 

$('a.post-edit-link').attr({ 
         'data-inline' : true, 
         'data-role' : 'button' 
        }).button(); 

Answer 2

Не знаю, почему форма комментария из данных Вдобавок-THENE не работает ...

jQuery('#page').live('pageinit', function() { 
    var ulList = $('.widget ul'), aTag = $('a.post-edit-link') 
    ulList.attr('data-inset', 'true'); 
    ulList.attr('data-theme', 'd'); 
    ulList.attr('data-dividertheme', 'b'); 
    ulList.attr('data-role', 'listview'); 
    ulList.listview(); 
    aTag.attr('data-inline', 'true'); 
    aTag.attr('data-role', 'button'); 
    aTag.button(); 
    $('#commentform').attr('data-theme', 'e'); ... 

попробуйте это сначала (причина в том, что вы не хотите каждый раз анализировать DOM для этого объекта jQuery, вместо этого сохраните его в памяти, он будет экономить время обработки на много) ... теперь попробуйте это для вашего выбора:

$('.widget').first('ul');