36

私はこのコードを持っています:

<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>

と

$(".baz").click(function() {
    alert("test: " + $(this).siblings(".bar")[0].text()); // Doesn't work
});

siblings(".bar")[0]動作しません。(警告ボックスはポップアップせず、javascript エラーもありません)

1 人の兄弟だけを選択する適切な方法は何ですか?

jsFiddle を試す

編集:prev()またはを使用したくありませんnext()。

4

6 に答える 6

53

メソッドを使用してeq、一致する要素のセットを特定のインデックスの 1 つに減らすことができます。

$(this).siblings(".bar").eq(0).text()

これにより、セット内の最初の要素が選択されます。あなたの場合、prev探している要素がクリックされた要素の直前にあるため、単純に を使用できます。

$(this).prev(".bar").text()

使用していた配列表記法の問題は、jQuery オブジェクト内に含まれる実際の DOM ノードを返すことであり、それにはtextメソッドがありません。eqこれを行う同等の jQuery メソッドです。

于 2011-09-05T13:58:39.297 に答える
12

first を使用して、jQuery オブジェクトから最初の要素を取得することもできます。

alert(siblings(".bar").first().text());
于 2011-09-05T13:59:54.663 に答える
2

http://api.jquery.com/next/および/またはhttp://api.jquery.com/prev/。

したがって、次のようになります。

$(this).prev().text()); また $(this).next().text());

于 2011-09-05T13:56:20.110 に答える
2

next() または prev(); を使用できます。

$(".baz").click(function() {
    alert("test: " + $(this).prev(".bar").text());
});

ここでフィドルhttp://jsfiddle.net/fMT5x/2/

于 2011-09-05T13:56:29.327 に答える
1

次のいずれかを実行できます。

$(".baz").click(function() {
    alert("test: " + $(this).prev.html());
});

ただし、前のアイテムが .baz に存在することを確認する必要があります

または（より良い）

$(".baz").click(function() {
    alert("test: " + $(this).siblings(".bar").eq(0).text());
});

または（さらに悪い）、参考までに、決して使用しないでください:)

$(".baz").click(function() {
    var text = 0;
    $(this).siblings(".bar").each(function(){ text = $(this).text(); break; });
    alert("test: " + text);
});
于 2011-09-05T14:02:30.420 に答える
1

これは、Jquery で兄弟要素を選択する方法を学ぶのに役立つリンクです。

jQueryで兄弟を1人だけ選択する方法

$("selector").nextAll(); 
$("selector").prev();

Jqueryセレクターを使用して要素を見つけることもできます

$("h2").siblings('table').find('tr');

詳細については、このリンクを参照してくださいnext(), nextAll(), prev(), prevAll(), find() and siblings in JQuery

于 2015-05-04T12:58:44.630 に答える