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 %}

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

我想在模式上显示它。

Answer 1

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

VALUES

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

我希望这会对您有所帮助

Answer 2

您可以尝试以下操作：

$('.btn.delete').on('click', function(event){
     $(event.currentTarget).closest('tr').children('td').first().text();
});

这将获得最接近按钮的<tr>，然后从第一个<td>内部获取值

Answer 3

为了避免在循环中玩id，我更喜欢以下（在本机JS中）;

将按钮更改为：

<button type="button" class="delete btn"  onclick="delete(event)"><i class="fa fa-trash"></i></button>

在JS部分中捕获该按钮，如下所示：

function delete(event) {
 console.log(
   (event.currentTarget)
   .parentElement
   .parentElement
   .parentElement
   .childNodes[0]
   .innerHTML)
}

Answer 4

您可以使用类似这样的内容：

{% for dimension in dimension_list %}
<tr>
  <td id="{{dimension.id}}">{{dimension.title}}</td>
  <td>{{dimension.description}}</td>
  <div class="button-group">
    <td><button type="button" class="delete btn" onclick="get_title(\'' +{{dimension.id}}+ '\',\'' +{{dimension.title}}+ '\');"  ><i class="fa fa-trash"></i></button></td>
  </div>
</tr>       
{% endfor %}

JS部分：

function get_title(id,title){
  var title = $("#"+id).text();
  console.log(title);
}

如何从表tr td获取值

4 个答案: