JQuery Mobile: явно переопределить округление всех углов - PullRequest
0 голосов
/ 30 сентября 2011

jQuery Mobile автоматически округляет все углы элементов ввода, добавляя класс ui-corner-all. Я заметил, что если я изменю этот класс вручную на ui-corner-left в Инспекторе Chrome, то я правильно получу только закругленные углы слева (верх и низ). Конечно, это можно легко сделать с помощью одной строки jQuery, например

$('#myid').removeClass('ui-corner-all').addClass('ui-corner-left');

У меня вопрос, есть ли способ, которым я могу дать команду jQuery Mobile немедленно применить этот класс, не выполняя этот дополнительный бит кода после того, как JQM выполнит свою работу?

Ответы [ 3 ]

0 голосов
/ 30 ноября 2012

Вы можете переопределить значение по умолчанию, указав в своем файле index.html требуемый мобильный класс jquery. Хорошим примером будет вместо:

<ul id='myid' data-inset='true' data-theme='a' data-role='listview'  class='ui-listview ui-listview-inset ui-shadow'>

, который автоматически вставил бы это

class ui-corner-all

Затем вы добавите свой собственный класс:

<ul id='myid' data-inset='true' data-theme='a' data-role='listview'  class='ui-listview ui-corner-left ui-listview-inset ui-shadow'>

В Firefox класс ui-corner-all для меня не добавляется автоматически, возможно, вы используете более старую версию jquery mobile и вам нужно обновить ее. Если вы хотите сделать это динамически в файле JavaScript:

$("#my_page_id").live("pagecreate",function(){
    var ul = $("<ul id='myid' data-inset='true' data-theme='a' data-role='listview'  class='ui-listview ui-listview-inset ui-corner-left ui-shadow'>");
    ul.append($('<li class="ui-li ui-li-static  ui-body-a ui-corner-left">').append("Code Slayer!!!"));
    $('mydiv_in_mypage').html(ul);   

});

как и при переписывании содержимого div заново, автоматически стирая старое содержимое. Если вы отобразите много информации в своем списке, вы можете использовать

$.mobile.showPageLoadingMsg('a','Page Loading', true);

и затем скрыть сообщение, когда ваша страница будет полностью отображена.

0 голосов
/ 04 сентября 2014

эй Просто вы можете сделать это

  <a  href="#panel"  data-corners="false"></a>
0 голосов
/ 30 сентября 2011

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

$('div').live('pageshow',function(event){
     $('#myid').removeClass('ui-corner-all').addClass('ui-corner-left');
});
...