3

为什么这不起作用$(this).parents("tr").find("td:eq(2)").html()

我无法缝合以获取getthis相对于td tr调用它的文本“”

<table>

    <tr>
        <td>1</td>
        <td>getthis</td>
        <td onclick="$(this).parents("tr").find("td:eq(2)").html()">4</td>
        <td>5</td>
    </tr>

    <tr>
        <td>1</td>
        <td>getthis</td>
        <td onclick="$(this).parents("tr").find("td:eq(2)").html()">4</td>
        <td>5</td>
    </tr>

        <tr>
        <td>1</td>
        <td>getthis</td>
        <td onclick="$(this).parents("tr").find("td:eq(2)").html()">4</td>
        <td>5</td>
    </tr>

    <tr>
        <td>1</td>
        <td>getthis</td>
        <td onclick="$(this).parents("tr").find("td:eq(2)").html()">4</td>
        <td>5</td>
    </tr>   

</table>
4

6 回答 6

12

您使用双引号太多了。在行中创建字符串时，您会意外地结束该onclick属性。此外，eq它是零索引的，所以你想要1。

更好（但只是因为它有效）：

<td onclick="$(this).parents('tr').find('td:eq(1)').html()">4</td>

最好的：

$("table").on("click", "td:nth-child(2)", function(e) {
    $(this).prev().html();  //Get the previous sibling's HTML without inline JS
});
于 2012-06-28T11:39:51.640 回答
2

您应该用块中的一小段代码替换重复的内联事件处理程序（容易出错且过时）<script>：

这使用在整个表上注册的单个“委托”处理程序，但只监听第三列的点击：

$('table').on('click', 'td:nth-child(3)', function() {
    alert($(this).prev().html());
});

[这段代码当然应该出现在$(document).ready()处理程序中，以确保它在加载 DOM 之后才会运行]。

于 2012-06-28T11:37:33.200 回答
2

您的实际问题是您使用双引号来分隔您的 onclick，但也在 jQuery 中。它应该是：

 onclick="$(this).parents('tr').find('td:eq(1)').html()"

但更好的是：只需使用prev() JQuery Doc

$(this).parents("tr").find("td:eq(2)").html()

会成为

$(this).prev().html();

将这些点击处理程序放在一个单独的函数中（尽管有可能，但您可能希望使用一个类（例如click）来处理相应的 td）：

$('table').on('click', 'td.click', function() {
    alert($(this).prev().html());
});
于 2012-06-28T11:37:38.040 回答
2 
<table>
    <tr>
        <td>1</td>
        <td>getthis</td>
        <td class="clickMe">4</td>
        <td>5</td>
    </tr>
</table>

<script>
$(".clickMe").click(function() {
    alert(this.parentNode.children[1].innerText);
});
</script>

这是一个工作示例：http: //jsfiddle.net/sme7c/1

于 2012-06-28T11:38:03.377 回答
1

尝试closest代替parents

于 2012-06-28T11:35:01.693 回答
0

您的代码存在许多问题。

  1. 您在 jQuery 代码中使用了双引号，但没有对它们进行转义，因此您过早地结束了该属性，并生成了无效的 HTML。

  2. jQuery 代码只是简单地返回一个字符串，但不使用它做任何事情，所以你不应该期望看到任何东西。

  3. 您的元素索引可能是错误的；元素从 0 开始索引，而不是 1，因此:eq(2)返回第三个元素，而不是第二个。或者，换一种说法，您的代码会找到已单击的完全相同的元素。

于 2012-06-28T11:41:33.407 回答