1

今、私はこのコードを持っています:

<script type="text/javascript">
   function delete_box(n) {
     document.getElementById("box"+n).style.display = "none";
   }
<script>

<div id="box1">
 <table>
  <td>some code</td><td><input type="button" value="Delete this box" onclick="delete_box(1)"></td>
 </table>
</div>

それは正常に動作します。ボタンを押すとボックスが消えます。ただし、単純化して次のようにしたい：

<script type="text/javascript">
   function delete_box(n) {
     document.getElementById(n).style.display = "none";
   }
<script>

<div id="box1">
 <table>
  <td>some code</td><td><input type="button" value="Delete this box" onclick="delete_box(this.parentnode.id)"></td>
 </table>
</div>

ただし、意図したとおりに機能しません。コンソールには、ID が null であると表示されますが、その理由はわかりません。私は何を間違えましたか？

ありがとうございました。

4

2 に答える 2

5

まず、プロパティ名は.parentNode. また、無効な html 構造を持っているため、間違った先祖を参照しています (html インスペクターで確認できるように、ブラウザーはそれを修正しました)。

delete_box(this.parentNode.parentNode.parentNode.parentNode.parentNode.id)

説明は次のとおりです: -> -> -> - >を取得してさらに上に行くとthis、要素にリンクしています。input.parentNodetdtrtbodytablediv#box1

JSFiddle

于 2014-12-04T03:31:55.637 に答える
0

まず、HTML が無効です。Atdは の中にありtr、 atrはthead、tbody、またはtfoot要素の中にあります。その要素はtable.

ボタンの親は ではありtdませんtable。ID を取得するには、複数の親を調べる必要があります。

于 2014-12-04T03:32:22.740 に答える