Как сделать массив Javascript глобальным?

Question

Простите, мне нужна небольшая помощь, у меня нет мозга кодеров, на самом деле я впечатлен, что получил это далеко, но теперь мне нужна небольшая помощь.

Я пытаюсь создать плеер для загрузки html-файлов в div из xml-файла, а затем сможет перемещаться по страницам с помощью предыдущих и следующих кнопок. До сих пор мне удалось загрузить xml, преобразовать его в массив и загрузить первую страницу, но когда я нажимаю на предыдущие и следующие кнопки, я получаю «страницы неопределенными».

Вот код:

$(document).ready(function(){ 

    var i = 0; 

    $.ajax({ 
     type: "GET", 
     url: "studyguide/new_course.xml", 
     dataType: "xml", 
     success: function(xml) {   
      pages = parseXml(xml) 
      doStuff(pages); 
      loadFirstPage(pages); 
     } // END success 
    }); //END ajax 

    function parseXml(xml) { 
     var pages = []; 
     $(xml).find("page").each(function() { 
      pages.push({ 
       title: $(this).find("title").text(), 
       url: $(this).find("url").text() 
      }); // END .push 
     }); // END .each 
     return pages; 
    } // END parseXML 

    function doStuff(pages) { 
     //Do some javascript stuff with the response 
     alert(pages[0].title); 
     alert(pages[0].url); 
    } // END doStuff 

    function loadFirstPage(pages){ 
     //alert(pages[i].url); 
     $('#displayResults').html('<img src="../images/495.gif" />'); 
     $("#displayResults").load(pages[i].url, function() { 
     }) //END .load 
    }; //END loadFirstPage 

    function loadPage(pages){ 
     //alert(pages[i].url); 
     $('#displayResults').html('<img src="../images/495.gif" />'); 
     $("#displayResults").load(pages[i].url, function() { 
     }) //END .load 
    };// END loadPage 

    $('#prev').bind('click', function(pages) { 
     i--; 
     //alert(i); 
     loadPage(); 
    }) //END click 

    $('#next').bind('click', function(pages) { 
     i++; 
     //alert(i); 
     loadPage(); 
    }) // END click 

}); // END ready 

И XML:

<?xml version="1.0" encoding="iso-8859-1"?> 
<course> 
    <section name = "Section One"> 
     <page> 
      <title>Page 1</title> 
      <url>studyguide/page1.html</url> 
      <instructions></instructions> 
     </page> 
     <page> 
      <title>Page 2</title> 
      <url>studyguide/page2.html</url> 
      <instructions></instructions> 
     </page> 
     <page> 
      <title>Page 3</title> 
      <url>studyguide/page3.html</url> 
      <instructions></instructions> 
     </page> 
    </section> 
    <section name = "Section Two"> 
     <page> 
      <title>Page 1</title> 
      <url>studyguide/page4.html</url> 
      <instructions></instructions> 
     </page> 
     <page> 
      <title>Page 2</title> 
      <url>studyguide/page5.html</url> 
      <instructions></instructions> 
     </page> 
    </section> 
</course> 

Так что у меня 2 Вопросы, во-первых, как сделать массив глобальным, поэтому он может быть использован функцией loadPage , Во-вторых, есть ли лучший способ сделать это в первую очередь. Xml может содержать 5 страниц или 100 страниц, поэтому я хочу сохранить его динамическим.

Thanks

Спасибо за помощь. Я сделал некоторые изменения, и теперь я получаю «страницы [I] не определено. К сожалению я не программист по своей природе, так что вы должны медленно идти со мной.

$(document).ready(function(){ 

    var i = 0; 
    var pages = []; 

    $.ajax({ 
     type: "GET", 
     url: "studyguide/new_course.xml", 
     dataType: "xml", 
     success: function(xml) {   
      pages = parseXml(xml) 
      doStuff(pages); 
      loadFirstPage(pages); 
     } // END success 
    }); //END ajax 

    function parseXml(xml) { 
     //var pages = []; 
     $(xml).find("page").each(function() { 
      pages.push({ 
       title: $(this).find("title").text(), 
       url: $(this).find("url").text() 
      }); // END .push 
     }); // END .each 
     return pages; 
    } // END parseXML 

    function doStuff(pages) { 
     //Do some javascript stuff with the response 
     alert(pages[0].title); 
     alert(pages[0].url); 
    } // END doStuff 

    function loadFirstPage(pages){ 
     //alert(pages[i].url); 
     $('#displayResults').html('<img src="../images/495.gif" />'); 
     $("#displayResults").load(pages[i].url, function() { 
     }) //END .load 
    }; //END loadFirstPage 

    function loadPage(pages){ 
     //alert(pages[i].url); 
     $('#displayResults').html('<img src="../images/495.gif" />'); 
     $("#displayResults").load(pages[i].url, function() { 
     }) //END .load 
    };// END loadPage 

    $('#prev').bind('click', function(pages) { 
     i--; 
     //alert(i); 
     loadPage(pages); 
    }) //END click 

    $('#next').bind('click', function(pages) { 
     i++; 
     alert(i); 
     loadPage(pages); 
    }) // END click 

}); // END ready 

Answer 1

Чтобы ответить на первый вопрос, если вы не 't положил var перед объявлением переменной, он станет глобальным (на объекте окна). Обычно это считается плохой идеей. Я лично, вероятно, объявлю переменную в вашей функции ready, а затем использую ее для других функций внутри этот объем.

Еще одно замечание здесь заключается в том, что вы настроили функцию loadPage с параметром, однако тогда вы не передаете ему что-либо в своем обращении к нему.

Я думаю, что ваш подход работает очень хорошо.