javascript - 我正在尝试使用 jQuery 创建 "Sinking ships"

Question

到目前为止，我正在尝试制作将船只放置在船上的功能，但我在检查某些字段是否可用的功能方面遇到了一些问题。我的基本想法是有一种方法可以在单击按钮时调用:

$("#dodaj1x1").click(function(){
        var raspolozivo=parseInt($("#raspolozivo1x1").text());
        if(raspolozivo>0){

            generisi1x1();//call for function that generate random field

            var novoRaspolozivo= raspolozivo-1;
            $("#raspolozivo1x1").html(novoRaspolozivo);
        }
        else{
            alert("Rasporedjeni svi raspolozivi brodovi ovog tipa!");
        }
    });

它会调用函数生成随机场:

function generisi1x1(){
            var minR = 0;
            var maxR = 9;
            var minK = 0;
            var maxK = 9;
            randRed=Math.floor(Math.random() * (maxR - minR + 1)) + minR;
            randKol=Math.floor(Math.random() * (maxK - minK + 1)) + minK;
            proveri1x1(randRed,randKol);//call to function to check is field available
    }

比函数 generisi1x1() 调用的函数检查该字段是否可用:

function proveri1x1(randRed,randKol){
        for(i=randRed-1;i<randRed+2;i++){
            for(j=randKol-1;j<randKol+2;j++){
                if($(".red"+i+".kolona"+j+"").hasClass('deoBroda')){
                    alert("red:"+" "+i+" kolona:"+j);
                    generisi1x1();
                }
                else { postavi1x1(randRed,randKol);}
            }
        }
    }

我的问题是有时这个工作很好(至少看起来很好，也许纯粹是运气)，有时它只生成 3 艘船 1x1(应该有 4 艘)，有时它会向我显示有关问题的消息并生成5 艘船(4 艘在正确的地方，1 艘在错误的地方)等。

坏情况的打印屏幕:Added ship 1x1 on position 5,3 right next to ship 4x1

这是整个代码的现场演示:Live demo

到目前为止，我可以插入 4x1 和 1x1 的船只，并且只检查 1x1，计划对所有船只做同样的事情，任何帮助都会很好。

Answer 1

如果 proveri1x1() 执行检查并返回 true 或 false 和 generisi1x1( ) 执行postavi1x1() Action ；

function generisi1x1() {
    var minR = 0, maxR = 9, minK = 0, maxK = 9;
    randRed = Math.floor(Math.random() * (maxR - minR + 1)) + minR;
    randKol = Math.floor(Math.random() * (maxK - minK + 1)) + minK;
    if(proveri1x1(randRed, randKol)) { //call to function to check is field available
        postavi1x1(randRed,randKol);//set
    } else {
        generisi1x1();//try again
    }
}

function proveri1x1(randRed, randKol) {
    for(var i=randRed-1; i<randRed+2; i++) {
        for(var j=randKol-1; j<randKol+2; j++) {
            if($(".red" + i + ".kolona" + j).hasClass('deoBroda')) {
                return false;
            }
        }
    }
    return true;//<<<< note the position of this return statement
}