Question

我创建了一个在用户更改下拉列表时运行的javascript（注意：更改功能，以及我们获取下拉列表值的方式正常工作），我已经测试了多次运行，发现问题是我的第二个For-loop我真的不知道为什么它不起作用。

$(document).ready(function(){
        var username = prompt("Please enter your Username", "default");
        console.log("User: ",username);

        $.ajax({ url : "/memory/intro",
                type: "POST",
                data: JSON.stringify({"username": username}),
                contextType: "text/json; charset=utf-8",
                success : function(){console.log("Done!");}});

        $("#lvl").change( function (){
                var diff = $(this).find("option:selected").attr('value');
                console.log(diff); //Personal testing
                console.log(typeof(diff)); //Personal testing
                for(var i=0; i < diff; ++i){
                        var row;
                        row = $("<tr></tr>");
                        for(var x=0; i < diff; ++x) {
                                var col;
                                col = $("<div></div>");
                                col.addClass("card");
                                col.data("col", x);
                                row.append(col);
                        }
                        $("#cards").append(row);
                };

        });

});

注意：如果我们评论第二个for循环，整个代码工作正常，我们追加＆＃34; tr＆＃34;和＆＃34; div＆＃34;与班级名称

Answer 1

可悲的是，由于@nbrooks

，我没有意识到我在第二次循环中有i < diff

Answer 2

第二个forloop尝试：

      for(var x=0; x < diff; ++x) {
            var col;
            col = $("<td></td>");
            col.addClass("card");
            col.data("col", x);
            row.append(col);
      }

据我所知你不应该将div附加到tr，它会导致错误（不是js错误，但它仍然是标记错误）

如果您想确定此问题，请检查w3c validator

JQuery - 嵌套循环问题

2 个答案: