Question

我正在使用java-query在页面加载时生成棋盘：

基本上我有一个空身：

<body>
</body>

然后我将以下javascript链接：

var addsquareblack=function(i,row){$(document).ready(function(){

    var square=$('<div class="square"></div>');
    if ((i%2)===0)
        {square.css('background-color','brown');}
    $('.row').last().append(square);
});};

var addsquarewhite=function(i,row){$(document).ready(function(){

    var square=$('<div class="square"></div>');
    if ((i%2)===0)
        {square.css('background-color','white');}
        else
        {square.css('background-color','brown');}
    $('.row').last().append(square);
});};

var create=function(a){$(document).ready(function(){
    var row=$('<div class="row"></div>');
    $('body').append(row);
    if ((a%2)===0)
    {for(var i=1;i<9;i++){addsquareblack(i,row);}}
    else
    {for(var i=1;i<9;i++){addsquarewhite(i,row);}}
});};

var addrows=function(){
    for(var i=1;i<9;i++){create(i);}
    };

然后我在头脑中调用脚本：

<script> addrows() </script>

但是，addsquarewhite和addsquare黑色无法正常运行：我的div已将row个body正确添加到div，但随后我正在添加的所有正方形都聚集在最后div。我认为它们只会被添加到方法调用时可用的最后{{1}}。显然，我对javascript中的范围/流程一无所知。请指教。
谢谢！

Answer 1

此外，您在ready处理程序上的使用是错误的

这是因为您要将square元素添加到最后一行而不是行。

$('.row').last().append(square)

而不是

var addsquareblack=function(i,row){
    var square=$('<div class="square">1</div>');
    if ((i%2)===0) {
        square.css('background-color','brown');
    }
    row.append(square);
};

var addsquarewhite=function(i,row){
    var square=$('<div class="square">2</div>');
    if ((i%2)===0) {
        square.css('background-color','white');
    } else {
        square.css('background-color','brown');
    }
    row.append(square);
};

var create=function(a){

    var row=$('<div class="row"></div>');
    $('body').append(row);
    if ((a%2)===0) {
        for(var i=1;i<9;i++){
            addsquareblack(i,row);
        }
    } else {
        for(var i=1;i<9;i++){
            addsquarewhite(i,row);
        }
    }

};

var addrows=function(){
    for(var i=1;i<9;i++){
        create(i);
    }
};
$(document).ready(function(){
    addrows();
});

演示：Fiddle

函数jQuery中的调用排序

1 个答案: