jQuery 从 td 中找到 td 文本，在同一个 tr 中单击
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11243698/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
find td text from td click in same tr
提问by Hello-World
Why is this not working $(this).parents("tr").find("td:eq(2)").html()
为什么这不起作用 $(this).parents("tr").find("td:eq(2)").html()
I cant seam to get the text "getthis" relative to the tdtrthat called it
我无法获得getthis相对于tdtr调用它的文本“ ”
<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>
回答by Dennis
You are using double-quotes too much. When creating a string in line, you are accidentally ending the onclickattribute. Also, eqis zero-indexed, so you want 1instead.
您使用双引号太多了。在行中创建字符串时，您不小心结束了onclick属性。此外，eq是零索引的，所以你想要1。
Better (but only because it works):
更好（但只是因为它有效）：
<td onclick="$(this).parents('tr').find('td:eq(1)').html()">4</td>
Best:
最好的事物：
$("table").on("click", "td:nth-child(2)", function(e) {
$(this).prev().html(); //Get the previous sibling's HTML without inline JS
});
回答by Alnitak
You should replace your repeated inline event handlers (which are error prone, and outmoded) with a single small junk of code in a <script>block:
您应该用<script>块中的一小段代码替换重复的内联事件处理程序（容易出错且过时）：
This uses a single "delegated" handler registered on the entire table, but only listening to clicks on the 3rd column:
这使用在整个表上注册的单个“委托”处理程序，但只监听第三列上的点击：
$('table').on('click', 'td:nth-child(3)', function() {
alert($(this).prev().html());
});
[ This code should of course appear in a $(document).ready()handler to ensure it doesn't run until after the DOM is loaded].
[此代码当然应该出现在$(document).ready()处理程序中，以确保它在加载 DOM 之后才运行]。
回答by Christoph
Your actual problem is that you use the doublequotes for delimiting your onclick, but also in the jQuery. It should be:
您的实际问题是您使用双引号来分隔您的 onclick，但也在 jQuery 中使用。它应该是：
onclick="$(this).parents('tr').find('td:eq(1)').html()"
But even better: Just use prev()JQuery Doc
但更好的是：只需使用prev()JQuery Doc
$(this).parents("tr").find("td:eq(2)").html()
would become
会成为
$(this).prev().html();
Alnd put these click-handlers in a separate function ( although it is possible otherwise, you might want to use a class (e.g. click)to address the according td):
Alnd 将这些点击处理程序放在一个单独的函数中（尽管有可能，但您可能希望使用一个类（例如click）来解决相应的 td）：
$('table').on('click', 'td.click', function() {
alert($(this).prev().html());
});
回答by Greg
<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>
Here's a working example: http://jsfiddle.net/sme7c/1
这是一个工作示例：http: //jsfiddle.net/sme7c/1
回答by CyberDude
Try closestinstead of parents
尝试closest代替parents
回答by Anthony Grist
There are a number of problems with your code.
您的代码存在许多问题。
You're using double-quotes in your jQuery code, but haven't escaped them, so you're prematurely ending the attribute, and generating invalid HTML.
The jQuery code simply returns a string, but doesn't doanything with it, so you shouldn't expect to see anything.
Your element indexing may be wrong; elements are indexed from 0, not 1, so
:eq(2)returns the third element, not the second. Or, to put that another way, your code finds the exact same element that has been clicked on.
您在 jQuery 代码中使用了双引号，但没有对它们进行转义，因此您过早地结束了该属性，并生成了无效的 HTML。
jQuery 代码只返回一个字符串，但不对其执行任何操作，因此您不应期望看到任何内容。
您的元素索引可能有误；元素从 0 开始索引，而不是 1，因此
:eq(2)返回第三个元素，而不是第二个。或者，换句话说，您的代码会找到被点击的完全相同的元素。
