2016-04-13 12 views
1

jQueryを初めて使用しています。私はajaxリクエストを送信するリンクをクリックしています。コールバックでは、次のp要素のテキストを変更します。 私のhtmlコード:jQueryを使用して次または最後の要素を選択する方法

   <div> 
       <img src="/images/{{comment.commenterPicName}}" class="img-circle"> 
       <b>{{comment.commenterFirstName}}</b> 
       <p>{{comment.commentMessage}}</p> 

       {% if comment.isLiked %} 
        <a class="comment-like" id="{{comment.id}}">Unlike</a> 
       {% else %} 
        <a class="comment-like" id="{{comment.id}}">Like</a> 
       {% endif %} 
        <p>{{comment.likersCount}}</p> 
       </div> 

私のjQueryのコード:

$(".comment-like").click(function(e) { 
var el = $(this); 
if ($(this).html() == "Like") { 
    var parameters = { commentId: $(this).attr('id')}; 
    $.get(
     "/likeComment", 
     parameters, 
     function(data) { 
      el.parent().children('p').last().text(data); 
     } 
    ); 
    $(this).html('Unlike'); 
} 
else { 
    var parameters = { commentId: $(this).attr('id')}; 
    $.get(
     "/unlikeComment", 
     parameters, 
     function(data) { 
      el.parent().children('p').last().text(data); 
     } 
    ); 
    $(this).html('Like'); 
} 

私の問題は、私はlikersCountを含むp要素を変更することはできませんです。試しました.next().last()などお手伝いください。前もって感謝します。

+0

純粋なHTMLではありません。質問の下に、使用されている追加のライブラリを特定するタグを追加してください*(angular.js、node.jsなど) - タグがあります。 – gibberish

答えて

2

私は最終的に解決策を見つけました。代わりの

el.parent().children('p').last().text(data); 

は、私は単純に使用していた:

el.next('p').text(data); 

これは、常に正確な要件でした次のp要素を選択します。

0

セレクタ.siblings()を探している可能性があります。他のjQueryセレクタと組み合わせてHTMLをトラバースすることができます。

このセレクタは、呼び出す要素と同じレベルのすべての要素を取得します。ここで詳しい情報を見つけることができます。 http://api.jquery.com/siblings/

関連する問題