0

我正在使用 jquery-confirm，我需要捕获我单击编辑的元素的名称。

jQuery 和 jQuery 确认

<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
</head>

PHP

<?php
    $products = array(['name'=>'Balloon'],
        ['name'=>'Bike']);
?>

<table>
    <thead>
      <tr>
        <th>Name</th>            
        <th>Edit</th>
      </tr>
    </thead>    
    <tbody>
      <?php foreach($products as $prod) { ?>
        <tr>
          <td><?php echo $prod['name'] ?></td>
          <td><a class="edit" href="#">Edit Product</a></td>
        </tr>
      <?php } ?>
    </tbody>
</table>

脚本

$('a.edit').confirm({
    content: '<input type="text" value="$ Name of the product.">'
});

Obs：写“$ 产品名称”的地方，应该出现我点击的每个产品的名称。

4

1 回答 1

1

您可以使用this.$target获取a点击的标签，然后使用.closest('tr').find('td:eq(0)').text()获取第一个td内容。

演示代码： 

$('.edit').confirm({
  content: function() {
  //get closest tr and find get product name..
    return '<input type="text" value="' + this.$target.closest('tr').find('td:eq(0)').text().trim() + '">'
  }
});
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Edit</th>
    </tr>
  </thead>
  <tbody>

    <tr>
      <td>
        Abc
      </td>
      <td><a class="edit" href="#">Edit Product</a></td>
    </tr>
    <tr>
      <td>
        Abcd
      </td>
      <td><a class="edit" href="#">Edit Product</a></td>
    </tr>
    <tr>
      <td>
        Abce
      </td>
      <td><a class="edit" href="#">Edit Product</a></td>
    </tr>

  </tbody>
</table>

于 2021-01-17T14:10:05.353 回答