重新加载后无法单击jquery ajax项目答案

【问题标题】：jquery ajax item can not be clicked after reload重新加载后无法单击jquery ajax项目
【发布时间】：2013-04-23 06:57:42
【问题描述】：

我正在使用 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')
   });
});

在您第一次单击图像时效果很好。（转到另一张图像）但是当再次单击它时，不会发生 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

但目前还没有具体的解决方案... 任何改动最小的解决方案？

【问题讨论】：

标签： jquery ajax django reload

【解决方案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')
   });
});

【讨论】：

【解决方案2】：

使用.on()，因为您将DOM 加载到ID 为tag_like 的div。

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

【讨论】：

没错！感谢这个小而精彩的改变！

【解决方案3】：

这样做：

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

这种方法速度很快，因为它会阻止 jQuery 在您每次单击按钮时解析整个文档。

【讨论】：

正确，除了在“#like”之后缺少一个“，”