AJAX 2回目の呼び出しが機能しません

Question

私は単純な投票ボタンを実行しようとしていますが、1回のリロードで1回だけ機能します。

それが動作するはずです方法： クリックして "+" - （ジャンゴ中）>更新クエリ - >をクリックすることができます " - - ">（ "+" 変更する " - "）のdivをリロードしupvoteを元に戻すには

初めて投票した後に「 - 」ボタンが表示されますが、クリックすると何も起こりません。私が "F5"を押してページをリロードした場合にのみ動作します。

コンソールにエラーはありません。

 ... some django scripts to check which button should be displayed ... 

     <span class="upvote"><span postId="{{post.id}}" class="vote" href="upvote/{{post.id}}">+</span></span> 

     <span class="downvote"><span postId="{{post.id}}" class="vote" href="downvote/{{post.id}}">-</span></span> 
     ... 

     $(document).ready(function(){ 
      $(".vote").click(function(e){ 
      href = $(this).attr("href"); 
      postId = $(this).attr("postId"); 
      $.ajax({ 
       url: href, 
       success: function() { 
        $("#post-"+postId+" >header").load(location.href+ " #post-"+postId+">header>*"); 
       }, 
      }); 
     }); 

「postId」と「HREF」属性が正しく

Answer 1

を満たしていることが、問題はあなたが投稿したコードに基づいているものは明白ではないのですが、私は<span>-</span>がDOMに追加されていることを推測していますの後に<span>+</span>をクリックしてください。その場合、問題は、ページロード時に初めてコードが実行されたときにDOM内にあった要素のうち、$('.vote').on('click'...が.voteにのみバインドされていることです。あなたのセレクタに一致する子どもたちからどんなイベントに静的親要素と行為にイベントハンドラをバインドするイベントの委任を使用してこの問題を解決することができます

$(document).on('click', ".vote", function(e){ 
    href = $(this).attr("href"); 
    postId = $(this).attr("postId"); 
    $.ajax({ 
     url: href, 
     success: function() { 
      $("#post-"+postId+" >header").load(location.href+ " #post-"+postId+">header>*"); 
     }, 
    }); 
})