1

次のコードがある場合：

<p>
Suspendisse dictum <span>feugiat</span> nisl ut dapibus. <span>Mauris</span><span> iaculis porttitor</span> posuere. Praesent id metus massa, ut blandit odio. Proin quis tortor orci.
</p>

そして、次のコードを使用します。

$("span").click(function(){
    alert($(this).prev().text());
});

をクリックすると<span> iaculis porttitor</span>、アラートが表示されMaurisます。prev()これは正しい動作ですが、要素が現在クリックされている要素のすぐ隣にあるかどうかだけを検出したいと思います。の前の要素はで<span> iaculis porttitor</span>あるため<span>Mauris</span>、これは正しく機能しています。

ただし、をクリックすると、前の要素のテキストであるため、<span>Mauris</span>アラートが表示されます。feugiat私が望むのは、直前<span>Mauris</span>に要素がなく、テキストのみであるため、これはfalseを返すことです。

これはjQueryで可能ですか？

4

3 に答える 3

1

previousSiblingがテキストノードであるかどうかを確認できます

$("span").click(function(){
  if (this.previousSibling){
    if (this.previousSibling.nodeType == 3){
        alert(false);
    }
    else{
        alert($(this.previousSibling).text());
    }
  }
});

http://jsfiddle.net/mowglisanu/PUnce/

于 2013-03-07T01:51:19.307 に答える
0

jQueryでは不可能です。ネイティブのDOMAPIを使用する必要があります。previousSiblingクリックされたDOMオブジェクトのプロパティを使用します。nodeTypeそのプロパティをクエリすることで、その要素がテキストノードであるか要素ノードであるかを確認できます。

于 2013-03-07T01:50:26.217 に答える
0

これが役立つかどうかはわかりませんが、ある程度のマイレージが含まれている可能性があります。

2つの関数を検討してください（両方ともデバッグが必要な場合があります）：

function unwrapUnhighlighted ($container) {
    $container.find("span.unhighlighted").unwrap();
}

function rewrapUnhighlighted ($container) {
    $container.contents().each(function(){
        if (this.nodeType == 3) {
            $(this).wrap('<span class="unhighlighted" />')
        }
    });
}

ここで、新しいスパンをunwrapUnhighlighted(...)挿入する前に呼び出し、後で呼び出すことを検討してください。.highlight()rewrapUnhighlighted (...)

したがって、すべてのテキストフラグメントがまたはのいずれ<span class="highlight">...</span>か<span class="unhighlighted">...</span>でラップされ、jQuery.prev().text()が当初の期待どおりに機能することが保証されます。

デバッグの.unhighlightedために、クラスを観察可能にするために背景色を指定します。

于 2013-03-07T02:56:59.587 に答える