我想在文章上点赞,我<div>
在另一个函数处理请求的地方使用 onclick 事件,这里是代码:
<div class="act">
<respect class="respect">
{% if new.voted_new(new.id) %}
<div class="button_like" data-new="{{new.id}}" onclick="Unlike();">
<div class="norespect" style="background: #2fcc71; border-color: #2fcc71;"></div>
</div>
{% else %}
<div class="button_like" data-new="{{new.id}}" onclick="Like();">
<div class="norespect" style=""></div>
</div>
{% endif %}
<p class='respectCount{{new.id}}'>{{new.respects}}</p>
</respect>
<views>
<p class="views_count"><i class="fa fa-eye"></i> {{new.views}}</p>
</views>
</div>
这是JQuery
代码:
function Like(){
$('.button_like, .respectCount').on('click', function(e){
e.preventDefault();
var new_id = $(this).attr('data-new');
var p_result = $(this).attr('data-result');
$.ajax({
url: "/client/cat-{{g.current_directory}}/news/like/",
type: 'post',
cache: false,
data: {
new_id: new_id
},
success: function(data){
$('p.respectCount'+new_id).text(data.result);
console.log(data.result);
$(this).fadeOut(500).fadeIn(500);
},
error: function(data){
return false;
}
}).done(function(data){
if (data){
$('p.respectCount'+new_id).text(data.result);
console.log(data.result);
$(this).fadeOut(500).fadeIn(500);
} else {
return false;
}
});
});
}
问题是我必须单击两次才能点赞,而且在控制台内我收到了两个 ajax 请求。
请问有什么帮助吗??
根据您的 HTML,您添加了内联点击处理程序
<div class="button_like" data-new="{{new.id}}" onclick="Like();">
</div>
在事件处理程序中,您附加了不显眼的事件处理程序。因此,无论何时button
单击,都会附加一个新的处理程序。
删除丑陋的内联点击处理程序,只使用不显眼的事件处理程序
$(function () {
$('.button_like, .respectCount').on('click', function (e) {
//Your code
});
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句