javascript - 如何从表 tr td 中获取值

Question

我的 html 文件中有此代码

{% for dimension in dimension_list %}
<tr>
  <td>{{dimension.title}}</td>
  <td>{{dimension.description}}</td>
  <div class="button-group">
    <td><button type="button" class="delete btn" id="btn-confirm-del" ><i class="fa fa-trash"></i></button></td>
  </div>
</tr>       
{% endfor %}

当用户点击按钮#btn-confirm-del时如何获取dimension.title的值？

我想在模态中显示它。

Answer 1

您可以在jquery中使用最接近的方法

$('.delete').on('click', function(){
 var dTitle = $(this).closest('tr').find('td:first-child').text()
  alert(dTitle);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
  <td>{{dimension.title}}</td>
  <td>{{dimension.description}}</td>
  <td>
  <div class="button-group">
    <button type="button" class="delete btn" >delete<i class="fa fa-trash"></i></button>
  </div>
 </td>
  
</tr>  

<tr>
  <td>{{dimension.title}}</td>
  <td>{{dimension.description}}</td>
  <td>
  <div class="button-group">
    <button type="button" class="delete btn" >delete<i class="fa fa-trash"></i></button>
  </div>
 </td>
  
</tr>  

</table>

希望这对你有帮助