从HTML表格jQuery中获取值

Question

我有一个包含以下值的HTML表：

<tr class="tuker1">
  <td class="tuker-lft1">
    Username
  </td> 
  <td class="tuker-rght1" onclick="awardRoute()">
    <a href="#">
      AWARD ROUTE
    </a> 
  </td> 
</tr>

当我单击AWARD ROUTE链接时，我希望“tuker-lft1”中的值进入函数变量。

awardRoute() {
  var username = "";
}

有关如何实现这一目标的任何想法？

Answer 1

假设您在页面上只有一个带有tuker-lft1类的元素：

function awardRoute() {
    var username = $('.tuker-lft1').text();
}

如果你想要前一个单元格的文本（即左边的单元格），你可以使用兄弟树遍历函数：

function awardRoute() {
    var username = $(this).prev('td').text();
}

$('.tuker-rght1').click(awardRoute);

如果您希望单元格中具有类tuker-lft1的文本与您单击的单元格在同一行中，无论单元格在何处，请使用父/子树遍历函数：

function awardRoute() {
    var username = $(this).parent().children('.tuker-lft1').text();
}

$('.tuker-rght1').click(awardRoute);

请注意，在最后两个示例中，您应该从HTML中删除onclick属性。

Answer 2

你可以像这样抓住它：

<td class="tuker-rght1" onclick="$(this).parents('tr').find('td:eq(0)').html()"><a href="#"> AWARD ROUTE </a> </td>

Answer 3

<td class="tuker1">
   <td class="tuker-lft1"> Username </td> 
   <td class="tuker-rght1"> <a href="#"> AWARD ROUTE </a> </td> 
</td>

$(function(){
    $('.tuker-rght1').on('click', function(e){
        e.preventDefault();

        var username = $(this).prev().html();

        console.log(username);
    });
});

Answer 4

用这个：

var username = $(this).closest('tr').find('.tuker-lft1').text();

Answer 5

请参考fiddle

标记：

<table>
    <tr>
        <td>
            Username
        </td> 
        <td class="award">
            Award
        </td>
    </tr>
</table>

JS：

var awards = [].slice.call(document.querySelectorAll('.award'));
awards.forEach(function(award){
    award.addEventListener('click', function(e){
        var parentNode = this.parentNode;
        var username = parentNode.querySelector('td').innerHTML;
        alert(username);
    });
});

Answer 6

var username = $(".tuker-lft1").val()