0

好的,这是我的问题。我对javascript有点陌生,所以请多多包涵。我没有在其他地方发现这个问题,实际上我认为这是我的逻辑不符合我的意愿;-)

我正在用 php 和 javascript 建立一个记忆游戏。我的问题是,当我第一次执行 clickCard 函数时,它会将变量 firstClick 设置为 True 并使用它的 innerHTML 值并执行 secondClick 等这么长时间,但如果猜测错误,则只有 secondClick 变为红色。这是因为我相信第一个参数是静态的(因此保存了 firstClick 的颜色值),我无法想出如何解决这个问题的解决方案。我尝试了不同的方法,例如创建条件,例如 if else(firstClick != 0 && firstClick != secondClick) {code} 等。

任何人都可以帮助我吗?

这是我的代码:

var firstClick = new Boolean();
firstClick.toString();

var secondClick = new Boolean();
secondClick.toString();
function clickCard(elem){               

    if(firstClick == 0){
        firstClick = document.getElementById(elem.id).innerHTML;
                    elem.style.backgroundColor = "green";   
        //alert(firstClick);
        }

    else{

        secondClick = document.getElementById(elem.id).innerHTML;
        //alert(secondClick);
        elem.style.backgroundColor = "green";


            if(firstClick == secondClick){
                alert(firstClick +" equals "+ secondClick);
                firstClick = new Boolean();
                secondClick = new Boolean();
            }

            else {
                alert(firstClick + " equals not " + secondClick);
                firstClick = new Boolean();
                secondClick = new Boolean();
                document.getElementById(elem.id).style.backgroundColor="red";
            }   
    }
}
4

3 回答 3

1

您的代码中有几个问题。看看我的更改并尝试理解它们,它应该可以工作:

  1. 初始化布尔值var bool = true/false;
  2. 不要将布尔值与 dom 元素混合
  3. 将您的瓷砖保存在单独的变量中
  4. 实际上将第一个图块的颜色设置为“红色”

代码:

var firstClick = true;
var piece1;
var piece2;

function clickCard(elem){               

    if(firstClick){
        piece1 = document.getElementById(elem.id);
        piece1.style.backgroundColor = "green";
        firstClick = false;  
    } else {

        piece2 = document.getElementById(elem.id);
        piece2.style.backgroundColor = "green";

        if(piece1.innerHTML == piece2.innerHTML){
            alert(firstClick +" equals "+ secondClick);
        } else {
            alert(firstClick + " equals not " + secondClick);
            piece1.style.backgroundColor="red";
            piece2.style.backgroundColor="red";
        }   
        firstClick = true;
    }
}

现在高级做法是将其放入闭包中以保护您的“内部”值 firstClick 和 piece1/2,但这是另一回事;)

于 2013-02-06T10:01:44.553 回答
1

你从来没有真正告诉第一个元素变成红色。您需要将第一个单击的元素保存在变量中,并在设置第二个元素的同时设置它。

请注意,您可能应该重新考虑您的逻辑。首先,您应该将游戏代码放在一个闭包中,并在那里生成棋盘以使其无法被外部访问,这样人们就无法通过查看源代码来作弊。然后当一张卡片被点击时,改变它的内容以显示卡片的价值,然后当你想把卡片翻过来时再次将其空白。

于 2013-02-06T09:53:00.760 回答
0

您正在innerHTML为类型的变量赋值Boolean。这段代码并不完全清楚。布尔对象代表两个值:“真”或“假”。还firstclick.toString()返回变量的字符串值,firstclick不做其他任何事情。

检查这是否是您想要的。

var Clicked = true;
var First, Second;

function clickCard(elem){               

    if(Clicked){
        First = document.getElementById(elem.id);
        elem.style.backgroundColor = "green";   
        Clicked = false;
    } else {

        Second = document.getElementById(elem.id);
        elem.style.backgroundColor = "green";

        if(First.innerHTML == Second.innerHTML){
            alert(First.innerHTML +" equals "+ Second.innerHTML);
        } else {
            alert(First.innerHTML  + " equals not " + Second.innerHTML );
            First.style.backgroundColor="red";
            Second.style.backgroundColor="red";
        }   
        First = "";Second="";
        Clicked = true;
    }
}
于 2013-02-06T09:58:08.570 回答