Question

all！我是jquery的初学者。我需要得到一个我点击的元素。移动到邻居并获得他们的价值观。

<td>21</td>
<td>Peter</td>
<td>Admin</td>
<td onclick=fillEditForm()>Edit record</td>

所以我需要点击“编辑记录”并获取之前<td>标签的jquery文本（21，Peter，Admin）。该功能必须看起来像我想的那样

    function fillEditForm(obj){    
    alert(obj.prev().text());
    }

Answer 1

试试此代码

<td onclick=fillEditForm(this)>Edit record</td>


function fillEditForm(obj){    
    alert($(obj).prev().text());
    }

Answer 2

您需要通过this这样fillEditForm(this)并$(obj)与parent().find()或prev()一起使用，您可以获得之前的任何td } elements。

您可以使用$(obj).parent().find('td:not(:last-child)').text()一起获取值。

或者

您可以遍历并获取每个文本$(obj).parent().find('td:not(:last-child)').each(function() {

或

您可以使用$(obj).parent().find('td:not(:last-child)').map(function() {获取数组中的所有文本

＆＃13;

function fillEditForm(obj) {

  console.log($(obj).parent().find('td:not(:last-child)').text()); // get all td except last

  console.log($(obj).prev().text()) //get prev text

  //get each separately
  $(obj).parent().find('td:not(:last-child)').each(function() {
    console.log($(this).text());
  });

  //get results in an array
  var results = $(obj).parent().find('td:not(:last-child)').map(function() {
    return $(this).text();
  }).get();
  console.log(results);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>21</td>
    <td>Peter</td>
    <td>Admin</td>
    <td onclick=fillEditForm(this)>Edit record</td>
  </tr>
</table>

＆＃13;

Answer 3

将类添加到您单击的td
使用此上下文告知点击的td
使用最近的获取父tr
使用.map（）创建tr中所有td的数组，但单击td

＆＃13;

$(".edit").click(function() {

  var arr = $(this).closest('tr').find('td:not(.edit)').map(function() {


    return $(this).text();
  }).get();

  console.log(arr)
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>11</td>
    <td>james</td>
    <td>user</td>
    <td class="edit">Edit record</td>

  </tr>
  <tr>
    <td>21</td>
    <td>Peter</td>
    <td>Admin</td>
    <td class="edit">Edit record</td>

  </tr>

</table>

＆＃13;

Answer 4

将this传递给内嵌点击处理程序。

<td onclick="fillEditForm(this)">Edit record</td>

将功能修改为

function fillEditForm(obj) {
  var arr = $(obj).siblings().map(function() {
    return $(this).text();
  }).get();
  console.log(arr)  
}

但是我会推荐不显眼的事件处理程序。使用正确的语义元素作为分配事件处理程序。然后可以使用各种DOM遍历方法来获取所需的信息。

＆＃13;

function fillEditForm() {
  var arr = $(this).closest('td').siblings().map(function() {
    return $(this).text();
  }).get();
  console.log(arr)  
}

$('.fillEdit').on('click', fillEditForm)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>21</td>
    <td>Peter</td>
    <td>Admin</td>
    <td><button class="fillEdit">Edit record</button></td>
  </tr>
</table>

＆＃13;

jQuery获取triger函数的元素

4 个答案: