jQuery 如何使用jQuery只选择一个兄弟姐妹?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7309080/
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
How to select only one sibling with jQuery?
提问by Benjamin Crouzier
I have this code:
我有这个代码:
<ul>
<li class="foo">foo text</li>
<li class="foo2">foo2 text</li>
<!-- more li here -->
<li class="bar">bar text</li>
<li class="bar2">bar2 text</li>
<!-- more li here -->
<li class="baz">clickme!</li>
</ul>
and
和
$(".baz").click(function() {
alert("test: " + $(this).siblings(".bar")[0].text()); // Doesn't work
});
siblings(".bar")[0]
doesn't work. (no alert box pops up, and no javascript error)
siblings(".bar")[0]
不起作用。(没有弹出警告框,也没有javascript错误)
What is the proper way to select one sibling only ?
只选择一个兄弟姐妹的正确方法是什么?
Edit:I don't want to use prev()
or next()
.
编辑:我不想使用prev()
or next()
。
回答by James Allardice
You can use the eq
method to reduce the matched set of elements to one at a specific index:
您可以使用该eq
方法将匹配的一组元素在特定索引处减少为一个:
$(this).siblings(".bar").eq(0).text()
That will select the first element in the set. In your case, you could simply use prev
, as the element you're looking for comes directly before the clicked element:
这将选择集合中的第一个元素。在您的情况下,您可以简单地使用prev
, 因为您要查找的元素直接出现在单击的元素之前:
$(this).prev(".bar").text()
The problem with the array notation method you were using is that it returns the actual DOM node contained within the jQuery object, and that's not going to have a text
method. eq
is the equivalent jQuery method to do this.
您使用的数组表示法的问题在于它返回包含在 jQuery 对象中的实际 DOM 节点,并且不会有text
方法。eq
是执行此操作的等效 jQuery 方法。
回答by Skylar Anderson
You can also grab the first element out of a jQuery object using first:
您还可以使用 first 从 jQuery 对象中获取第一个元素:
alert(siblings(".bar").first().text());
回答by NimChimpsky
http://api.jquery.com/next/and/or http://api.jquery.com/prev/.
http://api.jquery.com/next/和/或http://api.jquery.com/prev/。
So it would be:
所以它会是:
$(this).prev().text());
or $(this).next().text());
$(this).prev().text());
或者 $(this).next().text());
回答by Nicola Peluchetti
You could use next() or prev();
您可以使用 next() 或 prev();
$(".baz").click(function() {
alert("test: " + $(this).prev(".bar").text());
});
fiddle here http://jsfiddle.net/fMT5x/2/
回答by BlackDivine
You can either do:
你可以这样做:
$(".baz").click(function() {
alert("test: " + $(this).prev.html());
});
BUT, you have to be sure that a previous item exists to .baz
但是,您必须确保 .baz 中存在先前的项目
OR (Better)
或更好)
$(".baz").click(function() {
alert("test: " + $(this).siblings(".bar").eq(0).text());
});
OR (WORSE), just for reference, never use it :)
或(更糟),仅供参考,切勿使用:)
$(".baz").click(function() {
var text = 0;
$(this).siblings(".bar").each(function(){ text = $(this).text(); break; });
alert("test: " + text);
});
回答by Bharath Kumaar
Here is a link which is useful to learn about select a siblings element in Jquery.
这是一个链接,可用于了解如何在 Jquery 中选择兄弟元素。
How to select only one sibling with jQuery
$("selector").nextAll();
$("selector").prev();
you can also find an element using Jquery selector
您还可以使用 Jquery 选择器查找元素
$("h2").siblings('table').find('tr');
For more information, refer this link next(), nextAll(), prev(), prevAll(), find() and siblings in JQuery
有关更多信息,请参阅此链接next()、nextAll()、prev()、prevAll()、find() 和 JQuery 中的兄弟