[英]call data-id on ajax success response
Originally I have a "like button" that is working very smoothly, and it looked like this: 最初,我有一个“ like button”,它运行非常平稳,看起来像这样:
<a href="javascript:void();" class="like" id="<?php echo $row['id']; ?>">Like <span><?php echo likes($row['id']); ?></span></a>
Here is the Ajax code: 这是Ajax代码:
<script>
$(function(){
$(".like").click(function(){
var postid = $(this).attr("id");
$.ajax({
type:'POST',
url:'addlike.php',
data:'id='+postid,
success:function(data){
if(data=="you already liked this post"){
alert(data);
}
else{
$('a#'+postid).html(data);
}
}
});
});
});
</script>
If AJAX is successful, addlike.php will have two kinds of response, either alert "you already liked the post" if the user already liked it, or the updated number of likes. 如果AJAX成功,则addlike.php将有两种响应,如果用户已经喜欢,则警告“您已经喜欢该帖子”,或者更新喜欢的次数。 For example, if there are currently 10 likes, when the user clicked the button, $('a#'+postid).html(data) will change 10 to 11, because in this case the data will be the updated number of likes, and $('a#'+postid) selects the "like button" that is just being clicked.
例如,如果当前有10个点赞,则当用户单击按钮时,$('a#'+ postid).html(data)将从10变为11,因为在这种情况下,数据将为更新的点赞数,和$('a#'+ postid)选择刚刚被点击的“赞按钮”。
For some reason, I have to use data-id instead of id for the html id of the button. 由于某些原因,我必须使用data-id而不是id作为按钮的html id。 For more detailed explanation, see here: Disable boostrap toggle collapse for one class and enable it for another
有关更多详细说明,请参见此处: 禁用boostrap切换一个类的折叠并启用另一个类的折叠
Now I have to call the element which has a data-id instead of id on ajax success response, how can I do it? 现在,我必须在ajax成功响应上调用具有数据ID而不是ID的元素,该怎么办? I tried the following:
我尝试了以下方法:
$('a#data-id'+postid).html(data);
$('.[data-id="postid"]').html(data);
$('a[data-id='+postid']').html(data);
$('a#'+"[data-id=postid"]).text(data);
but none of them works. 但它们都不起作用。 Thanks in advance.
提前致谢。
通过data attribute
选择元素:
$('a[data-id="'+postid +'"]').html(data);
Create a property data-id='' in your anchor tag like your id property. 在您的锚标记中创建一个属性data-id ='',例如您的id属性。 Then, it will work.
然后,它将起作用。
Since post-id
is a variable and can contain any characters, it's necessary to place it between quotes ("") or simple quotes (''). 由于
post-id
是变量,可以包含任何字符,因此必须将其放在引号(“”)或简单引号(“)之间。 This requirement applies for every other attribute other than ID and CLASS, as stated in the docs 如文档中所述,此要求适用于ID和CLASS以外的所有其他属性
$("a[data-id='" + postid + "']").html(data);
You already have a reference to that button in $(this) inside the click handler. 您已经在点击处理程序中的$(this)中引用了该按钮。 I suggest you copy that into a variable and use that:
我建议您将其复制到变量中并使用:
<script>
$(function(){
$(".like").click(function(){
var $linkClicked = $(this);
var postid = $(this).attr("id");
$.ajax({
type:'POST',
url:'addlike.php',
data:'id='+postid,
success:function(data){
if(data=="you already liked this post"){
alert(data);
}
else{
$linkClicked.html(data);
}
}
});
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.