jQuery Mobile 1.1.0 RC 1 «Ошибка загрузки страницы» в NavBar нажмите - PullRequest
Новая
       33

jQuery Mobile 1.1.0 RC 1 «Ошибка загрузки страницы» в NavBar нажмите

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

Так как мое приложение jQuery Mobile на iPhone оказалось довольно медленным, я обновил его до RC, надеясь повысить скорость.

Однако, когда я нажимаю, появляется желтая «Ошибка загрузки страницы».на моей навигационной панели.

Я обрабатываю это так: 

$('div[data-role="navbar"] a').live('tap', function () {
    $(this).addClass('ui-btn-active');
    $('div.content_div').hide();
    $('div#' + $(this).attr('data-href')).show();
    $("#departureslist").listview("refresh");
    $("#arrivalslist").listview("refresh");
    return false;
});

Вид: 

<body>
    <div data-role="page" id="frontpage">
        <div data-role="header">
            <a data-icon="refresh" class="ui-btn-right" data-role="button" data-inline="true" data-iconpos="notext" id="refreshbutton"></a>
                <div id="headerlogo"><img src="images/ajax-loader.gif" id="loader" /></div>
                <div data-role="navbar">
                    <ul>
                        <li><a data-href="front" id="menu-front">Oversigt</a></li>
                        <li><a data-href="kort" id="menu-kort">Kort</a></li>
                        <li><a data-href="a" id="menu-a">Afgange</a></li>
                        <li><a data-href="b" id="menu-b">Ankomster</a></li>
                    </ul>
                </div>
            </div>
        <div data-role="content">
            <div id="front" class="content_div">        
            </div>

            <div id="a" class="content_div">
            <ul data-role="listview" id="departureslist" data-theme="c"></ul>               </div>

            <div id="b" class="content_div">
            <ul data-role="listview" id="arrivalslist"></ul> 
            </div>

            <div id="kort" class="content_div">
            <img src="images/retinamap.png" style="width: 100%;" /> </div>              
        </div>
    </div>

</body>

1 Ответ

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

Я бы предложил использовать свойство data-id вместо data-href, и вам также следует удалить класс ui-btn-active из тегов привязки в обработчике tap, иначе все кнопки в конечном итоге будут выглядеть так, как будто они активный: 

$('div[data-role="navbar"] a').live('tap', function () {
    $('div[data-role="navbar"] a').removeClass('ui-btn-active');
    $(this).addClass('ui-btn-active');
    $('div.content_div').hide();
    $('#' + $(this).attr('data-id')).show();
    $("#departureslist").listview("refresh");
    $("#arrivalslist").listview("refresh");
    return false;
});​​​​

Обновите navbar до: 

<div data-role="navbar">
  <ul>
   <li><a data-id="front" id="menu-front">Oversigt</a></li>
   <li><a data-id="kort" id="menu-kort">Kort</a></li>
   <li><a data-id="a" id="menu-a">Afgange</a></li>
   <li><a data-id="b" id="menu-b">Ankomster</a></li>
  </ul>
</div>

Смотрите это jsFiddle .

...