предупреждение не отображается в мобильном приложении jQuery

Я новичок в jquery и jquery mobile. В настоящее время я пытаюсь создать простое мобильное приложение, которое после загрузки страницы выводит предупреждение. я добавил в головной части HTML-файла, как это было предложено, следующий код:предупреждение не отображается в мобильном приложении jQuery

<link rel="stylesheet" href="jquery.mobile-1.3.0.min.css" /> 
<script type="text/javascript" src="jquery-1.9.1.min.js"></script> 
<script type="text/javascript"> 
    $('#chart').live('pageinit', function() { 
     alert('jQuery Mobile: pageinit for Config page'); 
    }); 
</script> 
<script type="text/javascript" src="jquery.mobile-1.3.0.min.js"></script>

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

<div data-role="page" data-theme="b" id="chart"> 
    <div data-role="header" data-position="fixed"> 
     <a href="#main-page" data-icon="arrow-r" data-iconpos="left" data-transition="slide" data-direction="reverse">Back</a> 
     <h1>Year Chart</h1> 
    </div> 

    <div data-role="content"> 
     <div id="container"></div> 
    </div> 
    <div data-role="footer" data-position="fixed"> 
     <div data-role="navbar"> 

     </div> 
    </div> 
</div>

Однако, когда страница диаграммы загружена в браузере моего компьютера (а не в телефоне), не отображается предупреждающее сообщение. Кто-нибудь знает, где может быть проблема? Заранее спасибо!

источник

2013-02-26 Anto

Вот полный HTML и код, который я могу получить в своем обозревателе (IE, chrome, firefox). Я думаю, что некоторые из ваших javascript не существуют или опечатываются. Попробуйте использовать CDN.

<html> 
    <head> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> 
     <script type="text/javascript"> 
      $('#chart').live('pageinit',function(event){ 
       alert('This page was just enhanced by jQuery Mobile!'); 
      }); 
     </script> 
    </head> 
    <body> 
     <div data-role="page" data-theme="b" id="chart"> 
      <div data-role="header" data-position="fixed"> 
       <a href="#main-page" data-icon="arrow-r" data-iconpos="left" data-transition="slide" data-direction="reverse">Back</a> 
       <h1>Year Chart</h1> 
      </div> 
      <div data-role="content"> 
       <div id="container"></div> 
      </div> 
      <div data-role="footer" data-position="fixed"> 
       <div data-role="navbar"> 
       </div> 
      </div> 
     </div> 
    </body> 
</html>

ОБНОВЛЕНО:

Если вы используете JQuery 1.9+, мы должны использовать .он вместо .live. Это потому, что .live был удален из 1.9. http://api.jquery.com/live/ Таким образом, код должен измениться, как это, если вы используете 1.9

$(document).on('pageinit','#chart', function(event){ 
    alert('This page was just enhanced by jQuery Mobile!'); 
});

источник

2013-02-26 14:46:54 Derek

Выполнено, но ничего не отображается, спасибо в любом случае – Anto

Как насчет копирования моего кода и запуска в браузере? – Derek

Derek, я использовал версию 1.9.1 (jquery-1.9.1.min.js), и это, похоже, проблема: с версией 1.8.2 появляется предупреждение, а в 1.9.1 оно ничего не делает. Вы можете это подтвердить? – Anto

Я думаю, что события jQuery Mobile page (например, pageInit) не выходят за пределы страницы. Попробуйте вставить тег сценария внутри страницы DIV как этот

<div data-role="page" data-theme="b" id="chart"> 
    <div data-role="header" data-position="fixed"> 
     <a href="#main-page" data-icon="arrow-r" data-iconpos="left" data-transition="slide" data-direction="reverse">Back</a> 
     <h1>Year Chart</h1> 
    </div> 

    <div data-role="content"> 
     <div id="container"></div> 
    </div> 
    <div data-role="footer" data-position="fixed"> 
     <div data-role="navbar"> 

     </div> 
    </div> 
    <script type="text/javascript"> 
     $('#chart').live('pageinit', function() { 
      alert('jQuery Mobile: pageinit for Config page'); 
     }); 
    </script> 
</div>

В качестве альтернативы вы можете связать функцию pageInit в элемент документа, как это:

$(document).live('pageinit', function() { 
     alert('jQuery Mobile: pageinit for Config page'); 
    });

Но я думаю, что первое решение более рядный с наилучшей практикой

источник

2013-02-26 14:37:38 seberenimer

Я попробовал оба пути, и ничто, кажется, чтобы показать. Это может быть проблема, связанная с браузером? – Anto

Какой браузер и версия вы используете? Но это не должно быть связано. – Derek

предупреждение не отображается в мобильном приложении jQuery

ответ

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