Конфликт Jquery mobile и Jquery Jplayer

У меня проблема с Jquery Mobile и Jquery Jplayer, конфликтующими друг с другом. Проблема, с которой я столкнулся, заключается в том, что когда вы включаете Jquery Jplayer в мобильный веб-сайт Jquery и нажимаете кнопку, чтобы начать прослушивание аудио, он меняет HTML-код кнопки, и это меняет внешний вид веб-сайта, потому что Jquery mobile не поддерживает просто измените html, он добавляет следующий код.

<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">Continue</span>
</span>

Каждый раз, когда я пытаюсь перезаписать его, включаю следующий скрипт:

$(это).html('Продолжить');

Это просто не работает. Есть идеи, что делать в этой ситуации?


person ElliotDurden    schedule 25.06.2012    source источник
comment
исключить определенные атрибуты jquery mobile из вашего контейнера, которые могут работать (в этом случае, вероятно, атрибут data-role = 'button')   -  person Th0rndike    schedule 25.06.2012
comment
но при этом он убирает весь вставленный стиль JQuery Mobile и оставляет его больше не похожим на кнопку.   -  person ElliotDurden    schedule 25.06.2012
comment
те промежутки, которые вы ненавидите, ЯВЛЯЮТСЯ мобильным стилем jquery...   -  person Th0rndike    schedule 25.06.2012
comment
Я не ненавижу их, все, что я пытаюсь понять или достичь, - это автоматически включать эти промежутки, когда я меняю текст или, точнее, когда Jplayer меняет текст этих кнопок. Это все.   -  person ElliotDurden    schedule 25.06.2012


Ответы (2)


Чтобы обновить элементы пользовательского интерфейса jQuery Mobile, вы должны вызвать .refresh() для элементов после изменения исходного элемента (работает только с элементами формы, а не с кнопками ссылок).

$(this).html('Continue').button('refresh');

Или Изменить текст кнопки jquery mobile

$("#consumed .ui-btn-text").text("Отметить как новый");

.

Если ваш элемент является кнопкой:

$(this).closest(".ui-btn").find(".ui-btn-text").text("Continue");

Если это ссылка:

$(this).find(".ui-btn-text").text("Continue");
person Ricardo Souza    schedule 25.06.2012
comment
Это решение дало мне следующее необработанное исключение ошибки: невозможно вызвать методы на кнопке до инициализации; попытался вызвать метод «обновить» - person ElliotDurden; 25.06.2012
comment
Я обновил ответ. Посмотрите, поможет ли это. Кроме того, разместите соответствующий код по вопросу как и отредактируйте, пожалуйста. - person Ricardo Souza; 25.06.2012
comment
Это решение сработало отлично. Все дело было в том, чтобы найти правильный диапазон, а затем изменить его текст. Спасибо, сэр! - person ElliotDurden; 25.06.2012

Если вы загрузили JQM с темами, то JQM переопределит базовые элементы в ваших стилях и стилях любых плагинов.

Есть загрузка только структуры JQM css: http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.css

Здесь есть несколько вариантов:

1) Зайдите в свой CSS и выполните переопределения JQM, чтобы добиться согласованных стилей, если они отличаются от тем в штучной упаковке.

2) Создайте свою собственную тему JQM.

3) Вопрос, действительно ли вам нужно использовать структуру JQM. Много раз я начинал с JQM только для того, чтобы заменить большую часть функциональности микро-решениями javascript/jQuery. Если вы обнаружите, что отказываетесь от функциональности JQM и заменяете ее чем-то другим, вам следует задаться вопросом, является ли использование JQM лучшим подходом.

person Lowkase    schedule 25.06.2012