jquerymobile - включает .js и .html - PullRequest
Новая
       6

jquerymobile - включает .js и .html

0 голосов
/ 10 января 2011

В моем приложении для отображения содержимого я использую не только HTML-страницу, и у каждой страницы есть собственный файл .js.Когда я вызываю html-страницу, тогда также включается файл .js.В .js я использую $('div').live('pageshow',function(){}).Я звоню в html-файл из. js(using $.mobile.changePage("htmlpage")).

Моя проблема: учтите, у меня есть два html-файла.Файл second.html вызывается с помощью one.js.когда я показываю second.html, тогда one.js снова перезагружается.Я получаю предупреждение "one.js", затем "second.js"

one.html 

<!DOCTYPE html> 
<html> 
  <head> 
    <title>Page Title</title> 
    <link rel="stylesheet" href="jquery.mobile-1.0a2.min.css" />
    <script src="jquery-1.4.3.min.js"></script>
    <script src="jquery.mobile-1.0a2.min.js"></script> 
    <script src="Scripts/one.js"></script>
  </head> 
  <body>         
    <div data-role="page">
    </div>
  </body>
</html>

Second.html 

<!DOCTYPE html> 
<html> 
  <head> 
    <title>Sample </title> 
    <link rel="stylesheet" href="../jquery.mobile-1.0a2.min.css" />
    <script src="../jquery-1.4.3.min.js"></script>
    <script src="../jquery.mobile-1.0a2.min.js"></script>
    <script type="text/javascript" src="Scripts/second.js"></script>
  </head> 
  <body>
    <div data-role="page">   
      <div data-role="button" id="link" >Second</div>
    </div><!-- /page -->
  </body>
</html>

one.js 

$('div').live('pageshow',function()
{     
   alert("one.js");
   //AJAX Calling 
   //success result than call the second.html 
   $.mobile.changePage("second.html");                   
});

second.js 

$('div').live('pageshow',function(){
{     
   alert('second.js');  
   //AJAX Calling 
   //success result than call the second.html 
   $.mobile.changePage("third.html");                   
});

Примечание: Когда я показываю.html тогда перезагружаются следующие файлы (one.js, second.js, третий, js и четвертый.js. Но мне нужен только четвертый.js).Я пытался использовать $ .document.ready (function () {});но в этот раз .js не звонил.

Ответы [ 2 ]

1 голос
/ 30 ноября 2011

Отредактировано за комментарий (Извините, ТАК новичок здесь):

Вот альтернативный подход к загрузке файлов JS на основе текущей HTML-страницы

Имейте один файл сценария, который включен на каждую страницу вашего приложения, но действует как не что иное, как файл «начальной загрузки», который обнаруживает текущую страницу и затем вставляет файл (ы) JavaScript в DOM.

Эта функция вставит Javascript: 

function insertScript(script, container) {
    var elem = document.createElement('script');
    elem.type = 'text/javascript';
    elem.src = 'Assets/Scripts/' + script + '.js';
    container.appendChild(elem);
}

И этот код обнаруживает текущую страницу 

// The 'pagechange' event is triggered after the changePage() request has finished loading the page into the DOM 
// and all page transition animations have completed.
// See: https://gist.github.com/1336327 for some other page events
$(document).bind('pagechange', function(event){

// grab a list of all the divs's found in the page that have the attribute "role" with a value of "page"
    var pages = $('div[data-role="page"]'),
    // the current page is always the last div in the Array, so we store it in a variable
    currentPage = pages[pages.length-1],
    // grab the url of the page the  was loaded from (e.g. what page have we just ajax'ed into view)
    attr = currentPage.getAttribute('data-url');

// basic conditional checks for the url we're expecting
if (attr.indexOf('home.html') !== -1) {
    // now we know what page we're on we can insert the required scripts.
    // In this case i'm inserting a 'script.js' file.
    // I do this by passing through the name of the file and the 'currentPage' variable
    insertScript('search', currentPage);
}

// rinse and repeat...
if (attr.indexOf('profile.html') !== -1) {
    insertScript('profile', currentPage);
}

});

Ссылочная ссылка

1 голос
/ 10 января 2011

Событие pagehow связывает функции JavaScript, которые запускаются при каждой загрузке страницы. Когда вы загружаете вторую страницу, вы создаете другую функцию показа страниц, которую вам на самом деле не нужно создавать.

Это должно помочь решить вашу проблему, если и только если вы определите это один раз: 

 $('div').live('pageshow',function(event, ui){
    alert('This page was just hidden: '+ ui.prevPage);
 });

 $('div').live('pagehide',function(event, ui){
    alert('This page was just shown: '+ ui.nextPage);
 });

Когда вы переходите на другие страницы, это предупредит вас о том, какая страница была только что показана, а какая была просто скрыта.

Большой ресурс:
http://jquerymobile.com/demos/1.0a2/#docs/api/events.html

http://forum.jquery.com/topic/mobile-events-documentation

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...