如何在JavaScript中獲取具有類名的確切父項？

Question

<div class="wrapped">

  <table id="tabled">
    <tr>
        <td>abc</td>
        <td>def</td>
        <td><input type="checkbox" class="chkbox" id="val" onclick="myFunction(this.id)"></input></td>
    </tr>
    <tr>
        <td>abc</td>
        <td>def</td>
        <td><input type="checkbox" class="chkbox" id="val1" onclick="myFunction(this.id)"></input></td>
    </tr>

  </table>

</div>

我的一些代碼會自動生成復選框的ID。 另外，DIV上有一個循環，其類名為“ wrapped”。 整個代碼至少打印兩次。 看起來像那樣

<div class="wrapped">
  <table id="tabled">
    <tr>
        <td>abc</td>
        <td>def</td>
        <td><input type="checkbox" class="chkbox" id="val1" onclick="myFunction(this.id)"></input></td>
    </tr>
  </table>
</div>    

<div class="wrapped">
  <table id="tabled">
    <tr>
        <td>abc</td>
        <td>def</td>
        <td><input type="checkbox" class="chkbox" id="val2" onclick="myFunction(this.id)"></input></td>
    </tr>
  </table>
</div>

現在，我嘗試添加一些JS來幫助我獲得“包裝”類的div。 這是我的js

function myFunction(el) {
    var el = document.getElementById(el);
    var r1 = el.closest(".wrapped");
    alert (r1.innerHTML);
}

它總是向我返回“包裝”類的First div的HTML。 我想要的是，如果我單擊ID為val2的復選框，它將返回第二個帶有“包裝”類的div。 但是，在我所有圍繞網絡的斗爭中，我只獲得所有選擇的第一。 提前致謝

Answer 1

但這是正確的並返回所需的.wrapped div。

您也可以將.wrapped直接傳遞給函數：

 onclick="myFunction(this.closest('.wrapped'))"

和js：

function myFunction(wr) {
     alert (wr.innerHTML);
}