JavaScript宾果游戏-使单元格可点击

下面是我为生成宾果卡而实现的HTML代码：

...
                    <th class="orange">B</th>
                    <th class="orange">I</th>
                    <th class="orange">N</th>
                    <th class="orange">G</th>
                    <th class="orange">O</th>
                </tr>
                <tr>
                    <td id="square0"> &nbsp;</td>
                    <td id="square1"> &nbsp;</td>
                    <td id="square2"> &nbsp;</td>
                    <td id="square3"> &nbsp;</td>
                    <td id="square4"> &nbsp;</td>
                </tr>

                ...

。。。
B
我
N
G
O
...

我想知道如何使单元格（即“td”）可以单击，并触发一个函数来更改.js文件中的颜色？

以下是我的.js文件：

var usedNums = new Array(76);

function newCard() {
    //Starting loop through each square card
    for(var i=0; i < 24; i++) {  //<--always this code for loops. change in red
        setSquare(i);
    }
}

function setSquare(thisSquare) {
    var currSquare = "square"+thisSquare;
    var newNum;

    var colPlace =new Array(0,1,2,3,4,0,1,2,3,4,0,1,3,4,0,1,2,3,4,0,1,2,3,4);

    do {
        newNum =(colPlace[thisSquare] * 15) + getNewNum() + 1;
    }
    while (usedNums[newNum]);

    usedNums[newNum] = true;
    document.getElementById(currSquare).innerHTML = newNum;
}

function getNewNum() {
    return Math.floor(Math.random() * 75);

}

function anotherCard() {
    for(var i=1; i<usedNums.length; i++) {
    usedNums[i] = false;
    }

    newCard();
}

var usedNums=新数组（76）；
函数newCard（）{
//通过每个方块卡开始循环
对于（var i=0；i<24；i++）{/我只需在td元素中添加一个button元素，然后按原样处理它。
这可能会在正确的方向上帮助您，HTML:

<table class="coolTable">
  <tr>
    <th class="orange">B</th>
    <th class="orange">I</th>
    <th class="orange">N</th>
    <th class="orange">G</th>
    <th class="orange">O</th>
  </tr>
  <tr>
    <td id="square0"> x</td>
    <td id="square1"> x</td>
    <td id="square2"> x</td>
    <td id="square3"> x</td>
    <td id="square4"> x</td>
  </tr>
</table>

你能详细说明一下吗？所以我尝试了类似于“它似乎不起作用。对不起。是的，我想说的是在td中包装一个按钮。所以不是type=而是另一个元素。但是另一个答案看起来也不错，如果它起作用的话：）啊……好吧，我有点明白你的意思。但是不确定具体的实现。有没有一个页面可以给我更多的细节？我现在是usi得到的我们希望它是一个好的实现。谢谢：）当我在JSFIDLE中尝试它时，我可以看到它，但是当我放入代码$（文档）时…在我的.js文件中并运行了该程序，我仍然无法单击该单元格。将JQuery放入.js文件中是否就是你所需要做的一切？@RosaryLightningX不客气，我将很快更新我的答案，但我很想知道否决投票背后的原因。@RosaryLightningX我没有完全理解你的问题，所以我根据我的解释编辑了我的答案我不知道你说的“在js文件中改变颜色”是什么意思，js文件中有代表颜色的变量吗？或者你的意思是在单击时通过js更改单元格的颜色吗？由于模糊性，我发布了一个大致的答案。JSIDLE也更新了。希望有帮助。顺便说一下，你标记了jquery，所以这是一个jquery答案。你需要链接jquery，它才能工作。你可以通过添加e您头上的标签如下：

$(document).on('click', 'td', function() {
    //To change properties of the clicked cell
  $(this).css("background-color", "black");
  $(this).css("font-weight","bold");
  $(this).css('color', 'red');

  //To call a function, or manipulate a function
  newCard();
  //To manipulate a function
  newCard("manipulated a function");
});

function newCard(x) {
    if (x){
    alert(x);
  }
    else{
    alert("called a function");
  }
}