javascript - 如何在函数[onClick]中在表中添加新行，并从除新行之外的所有行中删除此属性

Question

我编写了一个添加新行的代码，并在单击表中的现有行时删除了（onClick）属性

<table style="vertical-align:middle;margin:20px;" id="table_insert">
 <tr  id="tra" >
  <td >Word :</td><td onClick="insert_tr()"> <input type="text" id='word_text' ></input></td>
  <td>Definition :</td><td><input type="text" id='def_text' ></input></td>
 </tr>
</table>

这是添加新行的函数，从上一个删除 onclick attr 并将其添加到新添加的行：

<script type="text/javascript">
function insert_tr(){
     $(this).removeAttr('onClick'); //jQuery inside javascript function
     console.log("text:"+$(this).find('td').attr('onClick') ); 
        $('#table_insert').append('<tr onClick="insert_tr()"><td>Word :</td><td > <input type="text" id="word_text" ></input></td><td>Definition :</td><td><input type="text" id="def_text" ></input></td></tr>');
}
</script>

但它不起作用，在控制台屏幕上，它打印 [text:undefined] ..我该如何修复它？！

Answer 1

$(this) -- 这是一个窗口对象，而不是您期望的元素

传递this给函数

onClick="insert_tr(this)"

/

function insert_tr(elem){
     $(elem).removeAttr('onClick'); //jQuery inside javascript function
     // Your code here
}