獲取表單元格的ID

Question

我有一個html表，實際上是一個棋盤。 就像是：

<table id="chessboard">
    <tr>
       <td id="A8"></td>
       <td id="B8"></td>
       <td id="C8"></td>
    <tr>
    <tr>
       <td id="A7"></td>
       <td id="B7"></td>
       <td id="C7"></td>
    <tr>
    <tr>
       <td id="A6"></td>
       <td id="B6"></td>
       <td id="C6"></td>
    <tr>
</table>

現在，我試圖制作一個JQuery腳本，一旦單擊表（棋盤）上的任意位置，它就會返回單元格ID（即“ A8”，“ B6”等）。 我已經嘗試了很多，但是無法正常工作。

我嘗試過的一件事：

$("#chessboard").on("click", function(cell){
    alert(cell.target).attr("id"));

})

有人有解決辦法嗎？

Answer 1

嘗試：

 $("#chessboard td").on("click", function(cell){ alert(this.id); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <table id="chessboard"> <tr> <td id="A8">A8</td> <td id="B8">B8</td> <td id="C8">C8</td> <tr> <tr> <td id="A7">A7</td> <td id="B7">B7</td> <td id="C7">C7</td> <tr> <tr> <td id="A6">A6</td> <td id="B6">B6</td> <td id="C6">C6</td> <tr> </table> 

Answer 2

在這種情況下， cell.target指的是調度事件的DOM元素。 DOM元素沒有.attr()方法，即jQuery對象方法。

要使用它，您需要首先在jQuery對象中包裝DOM元素：

$("#chessboard").on("click", function(e){
    $cell = $(e.target);
    alert($cell.attr('id'));
});

Nitpick：將該event稱為相關event ，而不是cell 。 稍后只會使您感到困惑。

Answer 3

嘗試類似...

    $('#chessboard').click(function() {
    alert($(this).attr('id'));
});

“這個”就像一個魅力。

另外，不要忘記在文檔中的某處引用jquery腳本：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 4

試試這個伴侶

  $("#chessboard tr").on("click","td", function(cell){
        alert(this.id);
    })

這是JSFIDDLE上的示例

Answer 5

感謝您的答復。 我有答案。

這工作：

$("#chessboard td").on("click", function(cell){
    alert(this.id);
})