如何使用jQuery使表格中的每个单元格可单击

How do you make each cell inside of a table clickable using jQuery?

本文关键字：单元格 单击 何使用 jQuery 表格      更新时间：2023-09-26

我到处找，但我找不到我的问题的答案。我正在为学校的一个项目设计一个井字游戏。我创建了一个表3行和3列使用HTML，我试图使它，当我点击每个单元格一个x出现。什么好主意吗?

使用jQuery?

$("table td").click(function() {
   $(this).html("x");
});

我会在表上放一个id，然后用jquery从那里选择。

HTML: 

<table id="ticTac">
    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
    <tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
</table>
CSS: 

#ticTac tr td {
    border: 1px solid black;
}
#ticTac tr td {
    padding: 20px;
}
Javascript: 

$(document).ready( function() {
    $("#ticTac tr td").click(function() {
        $(this).html("x");
    });
});

JS Fiddle: https://jsfiddle.net/opL45vLr/

相关文章：