Программно изменяющаяся тема в компоненте JQuery Mobile

Почему тема 'e' не отражается на выходе?Программно изменяющаяся тема в компоненте JQuery Mobile

<!DOCTYPE html> 
<html> 
    <head> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 
     <title>title</title> 

     <script> 
      $(document).bind('pageinit', function() { 
       $('input').attr('data-theme', 'e'); 
      }); 
     </script> 

    </head> 

    <body> 

     <input type="text" /> 

    </body> 
</html>

источник

2013-04-22 siva636

«$ (" #input ") .textinput ({theme:" e "});' – Omar

Приведенный выше код работает при инициализации ввода, но после его создания в DOM лучшим способом является добавление/удаление классов. – Omar

Вот что именно в документе JQuery. Но это не работает! Вы проверили себя? – siva636

Кажется, нет прямой и простой способ сделать это.

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

Почему мы не можем думать о замене самого компонента? (Что-то вроде следующих)

$('selector').html('<input type="text" data-theme="e"/>').trigger('create');

Этот метод может быть немного странным, если компонент имеет много атрибутов, но это, кажется надежным и применим к любым компонентам JQM, которые вы хотели бы изменить динамически.

источник

2013-04-24 06:02:25 siva636

Возможно, вам придется активировать обновление.

$('input').attr('data-theme', 'e').trigger('refresh');

источник

2013-04-22 14:11:35 tymeJV

Вы протестировали его или написали теорией? :-) Это не работает для меня! – siva636

Просто писать по теории, также глядя на нее :). Вы пытались что-либо использовать с помощью функции .buttonMarkup()? – tymeJV

Поскольку .textinput не работает с refresh ни create, вот простой способ сделать это.

$('input').closest('div').removeClass('ui-body-c'); 
$('input').closest('div').addClass('ui-body-e');

тема по умолчанию для ввода является c, поэтому удалить его из родительского DIV и добавить тему e. Тем не менее, textinput будет по-прежнему иметь класс ui-body-c, но ui-body-e переопределит его, когда он будет добавлен в родительский div.

Demo

источник

2013-04-23 15:39:15 Omar

Спасибо, это работает! – siva636

@ DUKE welcome;) – Omar

Программно изменяющаяся тема в компоненте JQuery Mobile

ответ

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