如何使Javascript数组成为全局数组？

Question

原谅我我需要一点帮助，我没有编码人员的大脑，实际上，我给我留下了深刻的印象，但是现在我需要一点帮助。

我正在尝试构建一个播放器，以将xml文件从xml文件加载到div中，然后能够使用上一个和下一个按钮浏览页面。 到目前为止，我已经设法加载了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>

所以我有两个问题，首先是如何使数组成为全局数组，以便可以由loadPage函数使用。 其次，首先有没有更好的方法可以做到这一点。 xml可能包含5页或100页，所以我想保持动态。

谢谢

感谢您的帮助。 我进行了一些更改，现在我得到“ pages [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

要回答第一个问题，如果不将var放在变量声明的前面，它将变为全局变量（在window对象上）。 这样做通常被认为是一个坏主意。 我个人可能会在您的ready函数中声明该变量，然后将该变量用于该范围内的其他函数。

这里的另一个观察结果是，您使用参数设置了loadPage函数，但是在调用它时并没有传递任何信息。

我认为您的方法效果很好。