Jquery Mobile Закрыть Загрузку Иконка Проблема

Привет дама и господаJquery Mobile Закрыть Загрузку Иконка Проблема

Я недавно портировали свой сайт в JQuery мобильного и после многих часов переписывания моего настольного сайта, чтобы соответствовать меньшему экрану все прошло хорошо. Моя проблема связана с загрузкой страницы с несколькими часами беспорядка, и я могу получить счетчик для загрузки и отображения по своему желанию. Я использовал $ (document) .ready (function(), а затем добавил $ .mobile.loading ('show'), внутри которого загружается как ожидалось, однако моя проблема заключается в том, что он уходит после загрузки страницы, из документы я предположил, mobileinit будет делать трюк, но это, кажется, не в состоянии. Вот простой демо-кода я использую.

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Page Title</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 

     <script src="http://code.jquery.com/mobile/1.2.0-alpha.1/jquery.mobile-1.2.0-alpha.1.min.js"></script> 
     <script> 
$(document).ready(function() {   
$.mobile.loading('show', { 
    text: 'Loading', 
    textVisible: true, 
    theme: 'z', 
    html: ""  
}); 
}); 

<!---- How do I stop the spinner after page has loaded ? Docs state mobileinit = Event indicating that jQuery Mobile has finished loading.---------------> 
$(document).on("mobileinit", function() { 
$.mobile.loading('hide'); 
}); 

     </script> 
    </head> 

    <body> 
     <!-- /page --> 
     <div data-role="page"> 
      <!-- /header --> 
      <div data-role="header"> 
       <h1>Testing loader</h1> 
      </div> 
      <!-- /content --> 
      <div data-role="content"> 
      </div> 
     </div> 
    </body> 
</html>

заранее спасибо

источник

2014-11-01 Clive Atkins

Вместо HTML комментарий использование JS комментарий, в строке '// Как ...', кроме этого, я ничего плохого не вижу здесь –

Я думаю, что «мобильное событие» не стреляет –

@Venkata Panga благодарит любые идеи, почему это может быть? оцените ваш ответ. –

Пара изменений требуется!

Вы используете старые библиотеки jQuery, обновляете их до последней стабильной версии.
Порядок сценария для загрузки важен, как показано ниже.
1. Включить jquery.min.js.
2. Добавить mobileinit event script fragment Это место очень важно для определения определения обработчика mobileinit.
3. Включить 'jQuery.mobile.min.js`
4. Добавить фрагмент сценария, готовый для дома.

HTML:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.css"> 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script> 
     $(document).on("mobileinit", function() { 
      setTimeout(function() { 
       $.mobile.loading('hide'); 
      }, 1000); 
     }); 
    </script> 
    <script src="http://code.jquery.com/mobile/1.4.4/jquery.mobile-1.4.4.min.js"></script> 
    <script> 
     $(document).ready(function() { 
      $.mobile.loading('show', { 
       text: 'Loading', 
       textVisible: true, 
       theme: 'z', 
       html: "" 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <!-- /page --> 
    <div data-role="page"> 
     <!-- /header --> 
     <div data-role="header"> 
      <h1>Testing loader</h1> 
     </div> 
     <!-- /content --> 
     <div data-role="content"> 
     </div> 
    </div> 
</body> 
</html>

источник

2014-11-01 01:22:32

Еще раз спасибо, но я попытался пересмотреть код, но spinner не загружается. У меня будет беспорядок вокруг вас, используя ваш совет и посмотрим, смогу ли я исправить эту проблему. Однако оцените свои усилия. –

Обновлено, перемещено 'dom-ready loading ('show')' после JQM.js и добавлено 1sec задержка, чтобы скрыть функцию в 'mobileinit handler', я протестировал ее сейчас. –

Извините, первая версия, которую я не тестировал полностью, искал, когда срабатывает событие «mobileinit». На этот раз мы добавили время задержки, чтобы увидеть эффект. При полной загрузке страницы для вызовов без аякса очень сложно увидеть загрузчика, если на странице нет содержимого. –

Jquery Mobile Закрыть Загрузку Иконка Проблема

ответ

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