jQuery的AJAX項目不能重裝

Question

我使用Django

在體塊

<div id="tag_like"> 
    {% if liked %} 
     <img id="unlike" title="unlike" src="{{ STATIC_URL }}pic/bad.png" /> 
    {% else %} 
     <img id="like" title="like" src="{{ STATIC_URL }}pic/good.png" /> 
    {% endif %} 
</div> 

在on_ready腳本塊後可以點擊：

$.ajaxSetup({ 
    data: {csrfmiddlewaretoken: '{{ csrf_token }}'}, 
}); 
$('#like').click(function() { 
    $.post("{% url 'likevideo' %}", {uid:{{ login_id }}, videoid:"{{ videoid }}"}, function(data,status){ 
     $('#tag_like').load(' #tag_like') 
    }); 
}); 
$('#unlike').click(function() { 
    $.post("{% url 'unlikevideo' %}", {uid:{{ login_id }}, videoid:"{{ videoid }}"}, function(data,status){ 
     $('#tag_like').load(' #tag_like') 
    }); 
}); 

它工作正常，在第1點擊圖片（轉向其他圖片） 但是當再次點擊時，不會發生ajax動作。我讀

Refresh a div in Django using JQuery and AJAX

jqgrid not reloading after making a ajax call using trigger('reload')

Adding jQueryui Buttons to dynamically added content

但是，沒有具體的解決方案還沒有達到... 最小的變化的任何解決方案？

Answer 1

試試這個事件綁定：

$('#tag_like').on("click", "#like", function() { 
    $.post("{% url 'likevideo' %}", {uid:{{ login_id }}, videoid:"{{ videoid }}"}, function(data,status){ 
     $('#tag_like').load(' #tag_like') 
    }); 
}); 
$('#tag_like').on("click", "#unlike", function() { 
    $.post("{% url 'unlikevideo' %}", {uid:{{ login_id }}, videoid:"{{ videoid }}"}, function(data,status){ 
     $('#tag_like').load(' #tag_like') 
    }); 
}); 

Answer 2

使用.on()，因爲您要將DOM加載到ID爲tag_like的div。

$(document).on('click','#like',function(){ 
    //code here. 
}); 

Answer 3

不喜歡它：

$('#tag_like').on("click", "#like", function() { 
    $.post("{% url 'likevideo' %}", {uid:{{ login_id }}, videoid:"{{ videoid }}"}, function(data,status){ 
     $('#tag_like').load(' #tag_like') 
    }); 
}); 

這種方法快速，因爲它會以免jQuery你點擊按鈕每次解析整個文檔。