我已经编写了一个基本脚本,用于检测提交到我的网站(如 reddit)的链接的点赞按钮推送,在我的 View 中实例化一个函数并返回更新的点赞计数。代码的每一部分都工作正常,除了它只适用于模板中 for 循环中的第一项。我做错了什么,它不能捕获超过第一个元素?
我使用 jQuery 检测按钮按下的脚本如下所示:
<script>
$(document).ready(function() {
$('#likes').click(function(){
var link_id;
link_id = $(this).attr("data-linkset_id")
$.get('/uplink/', {linkset_id: link_id}, function(data){
$('#vote_value').html(data);
$('#likes').hide();
});
});
});
</script>
这是带有实际按钮的有问题的循环:
{% for link in linkset %}
{{link.url}}
<div id="vote_value">{{link.linklikes}}</div>
<button id ="likes" data-linkset_id="{{link.id}}" class="btn btn-mini btn-primary" type="button">like</button>
{% endfor %}
下面是我的 views.py 中的函数,它接受一个新链接对象并更改它的点赞数,然后返回更新后的整数:
def uplink(request):
context = RequestContext(request)
link_id = None
if request.method == 'GET':
link_id = request.GET['linkset_id']
likes = 0
if link_id:
thelink = newlink.objects.get(id=int(link_id))
if thelink:
likes = thelink.linklikes + 1
thelink.linklikes = likes
thelink.save()
return HttpResponse(likes)
非常感谢对此的任何帮助。
最佳答案
id
在页面上必须是唯一的。只有一个元素可以有特定的 id
。将 id
属性和选择器更改为类或数据属性。
$(document).ready(function() {
$('[data-role=like_container]').on('click', '[data-action=like_button]', function(e){
var $like_container = $(e.delegateTarget);
var $like_button = $(e.currentTarget);
var $vote_value = $like_container.find('[data-role=vote_value]');
var link_id = $like_button.data("linkset_id");
$.get('/uplink/', {linkset_id: link_id}, function(uplink_response){
$vote_value.html(uplink_response);
$like_button.hide();
});
});
});
{% for link in linkset %}
<div data-role="like_container">
{{link.url}}
<div data-role="vote_value">{{link.linklikes}}</div>
<button data-action="like_button" data-linkset_id="{{link.id}}" class="btn btn-mini btn-primary" type="button">like</button>
</div>
{% endfor %}
关于jquery - 请求仅适用于循环中的第一项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29834888/