二维阵列循环不显示

时间:2015-11-28 04:46:16

标签: javascript loops multidimensional-array

我认为我遇到了一个小问题。我正在做一个由3种类型组成的二维数组,每种类型都是一组电影。但是,[0]不允许代码显示......?我试图取消 document.write("<tr>"); for (var i = 0; i < Categories[0].length; i++) { for (var j = 0; j < Categories.length; j++) { document.write("<td class='movietd'>"); Categories[i][j].display(); document.write("</td>"); ...仍然无法正常工作,而且我没有收到来自Google控制台的任何错误消息?有任何想法吗? 谢谢!

function Movie(title, genre, rating, price, img) {
    this.title = title;
    this.genre = genre;
    this.rating = rating;
    this.price = price;
    this.image = img;
        this.display = displayMovies;
};

    function displayMovies(Infomovie) {
        document.write("<blockquote class='Informovieblock'><h3 class='infomoviett'>Title:</h3><p class='Informovie'>" + Infomovie.title + "</p><br>");
        document.write("<h3 class='infomoviett'>Genre:</h3><p class='Informovie'>" + Infomovie.genre + "</p><br>");
        document.write("<h3 class='infomoviett'>Rating:</h3><p class='Informovie'>" + Infomovie.rating + "</p><br>");
        document.write("<h3 class='infomoviett'>Price:</h3><p class='Informovie'>" + Infomovie.price + "</p></blockquote><br>");
        document.write("<span><IMG float:'center' SRC='" + Infomovie.image + "' style='width:138px; height:158px;'>" + "<BR><BR>");
    };

    var Moviesgenre = Array("Action", "Fiction", "Animation");
    var action = Array(3);
    var fiction = Array(3) ;
    var animation = Array(3);
    //spacer Arrays    
    var Categories = new Movie(action, fiction, animation);
                 action [0] = new Movie("Avengers the age of Ultron", "Action", "8.0/10.0", "$7.50", "Labs_Images/Avg_Ultron.jpg");
                 action [1] = new Movie("Mission Impossible: Rogue Nation", "Action", "7.5/10.0", "$8.99", "Labs_Images/Avg_Ultron.jpg");
                 action [2] = new Movie("Spectre", "Action", "7.1/10.0", "$9.99", "Labs_Images/Avg_Ultron.jpg");
        //spacer ScienceFiction
                 fiction [0] = new Movie("Mad Max: Fury Road",  "Fiction", "8.2/10.0", "$8.99", "Labs_Images/MM_road.jpg");
                 fiction [1] = new Movie("Jurassic World", "Fiction", "7.1/10.0", "$7.59", "Labs_Images/Avg_Ultron.jpg");
                 fiction [2] = new Movie("Pixels", "Fiction", "5.7/10.0", "$7.00", "Labs_Images/Avg_Ultron.jpg");
         //spacer Animation
                 animation [0] = new Movie("Inside Out", "Animation", "8.4/10.0", "$8.70", "Labs_Images/Avg_Ultron.jpg");
                 animation [1] = new Movie("Minions", "  Animation ", "6.5/10.0", "$6.50", "Labs_Images/Avg_Ultron.jpg");
                 animation [2] = new Movie("Avengers the age of Ultron", "Animation", "8.0/10.0", "$9.99", "Labs_Images/Avg_Ultron.jpg");
        //spacer Doc.write
                 document.write("<table class='movietab'>");
                 document.write(" <tbody class='table-hover'>");
                 document.write(" <tr>");
                 document.write("<th class='movieth'><h3>" + Moviesgenre[0] +"</h3></th>");
                 document.write("<th class='movieth'><h3>" + Moviesgenre[1] + "</h3></th>");
                 document.write("<th class='movieth'><h3>" + Moviesgenre[2] + "</h3></th>");
                 document.write(" </tr>");
                 document.write("<tr>");
                 for (var i = 0; i < Categories[0].length; i++)
                 {
                    for (var j = 0; j < Categories.length; j++)
                    {
                 document.write("<td class='movietd'>");
                                  Categories[i][j].display();
                 document.write("</td>");
                 }
              document.write("</tr>");
              }
                document.write(" </tbody>");
              document.write("</table>");

贝娄是完整的剧本:

unwrapped

2 个答案:

答案 0 :(得分:0)

我会尝试列出你的所有错误,也许你将能够修复你的脚本。

  • 首先请不要使用document.write是一个可怕的 实践。
  • 您的电影构造函数没有任何displayMovies 定义,所以会抛出错误
  • 您应该使用Array文字而不是Array构造函数
  • 在填充之前无法创建Categories对象 actionfictionanimation数组,您必须创建它 之后或您的对象将充满undefine s
  • 您不应将您的Categories对象命名为大写'C'
  • Categories是由Movie构造函数创建的对象, 不是数组,因此您无法使用它来访问其元素 Categories[0]

答案 1 :(得分:0)

这段代码存在很多问题,所以我只是在清理它时试图猜测你的目的是什么,这就是我想出的:

function Movie(title, genre, rating, price, img) {
    this.title = title;
    this.genre = genre;
    this.rating = rating;
    this.price = price;
    this.image = img;
    this.display = function(Infomovie){
        document.write("<blockquote class='Informovieblock'><h3 class='infomoviett'>Title:</h3><p class='Informovie'>" + Infomovie.title + "</p><br>");
        document.write("<h3 class='infomoviett'>Genre:</h3><p class='Informovie'>" + Infomovie.genre + "</p><br>");
        document.write("<h3 class='infomoviett'>Rating:</h3><p class='Informovie'>" + Infomovie.rating + "</p><br>");
        document.write("<h3 class='infomoviett'>Price:</h3><p class='Informovie'>" + Infomovie.price + "</p></blockquote><br>");
        document.write("<span><IMG float:'center' SRC='" + Infomovie.image + "' style='width:138px; height:158px;'>" + "<BR><BR>");
    }
}
var Categories = {
    action:[],
    fiction:[],
    animation:[]
};
Categories.action.push(new Movie("Avengers the age of Ultron", "Action", "8.0/10.0", "$7.50", "Labs_Images/Avg_Ultron.jpg"));
Categories.action.push(new Movie("Mission Impossible: Rogue Nation", "Action", "7.5/10.0", "$8.99", "Labs_Images/Avg_Ultron.jpg"));
Categories.action.push(new Movie("Spectre", "Action", "7.1/10.0", "$9.99", "Labs_Images/Avg_Ultron.jpg"));

//spacer ScienceFiction
Categories.fiction.push(new Movie("Mad Max: Fury Road",  "Fiction", "8.2/10.0", "$8.99", "Labs_Images/MM_road.jpg"));
Categories.fiction.push(new Movie("Jurassic World", "Fiction", "7.1/10.0", "$7.59", "Labs_Images/Avg_Ultron.jpg"));
Categories.fiction.push(new Movie("Pixels", "Fiction", "5.7/10.0", "$7.00", "Labs_Images/Avg_Ultron.jpg"));

//spacer Animation
Categories.animation.push(new Movie("Inside Out", "Animation", "8.4/10.0", "$8.70", "Labs_Images/Avg_Ultron.jpg"));
Categories.animation.push(new Movie("Minions", "  Animation ", "6.5/10.0", "$6.50", "Labs_Images/Avg_Ultron.jpg"));
Categories.animation.push(new Movie("Avengers the age of Ultron", "Animation", "8.0/10.0", "$9.99", "Labs_Images/Avg_Ultron.jpg"));

//spacer Doc.write
document.write("<table class='movietab'>");
document.write("<tbody class='table-hover'>");
document.write("<tr>");
for(var category in Categories)
{
    if(!Categories.hasOwnProperty(category))continue;
    document.write("<th class='movieth'><h3>" + category.charAt(0).toUpperCase() + category.substring(1) +"</h3></th>");
}
document.write("</tr>");
document.write("<tr>");
for(var category in Categories)
{
    if(!Categories.hasOwnProperty(category))continue;
    document.write("<td class='movietd'>");
    for (var movie in Categories[category])
    {
        Categories[category][movie].display(Categories[category][movie]);
    }
    document.write("</td>");
}
document.write("</tr>");
document.write("</tbody>");
document.write("</table>");

小提琴: http://jsfiddle.net/trex005/rd3cqvv6/(不允许document.write,所以我使用div代替)