gpt4 book ai didi

javascript - 用于单个 div 的 jquery 函数

转载 作者:行者123 更新时间:2023-11-30 09:07:09 25 4
gpt4 key购买 nike

我认为这可以通过 .prev() 函数来实现,但由于某些原因它不起作用。

我正在为博客上的帖子创建竖起大拇指/竖起大拇指按钮。我正在尝试根据用户投票显示消息。向上或向下但每当我对 1 个特定帖子进行投票时,所有帖子都会显示该消息。

这是我的代码。我删除了 prev() 尝试以使其更具可读性。该脚本在 ajax 方面运行良好。

$(document).ready(function() {
$(".vote_button").click(function(e) { //the UP or DOWN vote button
var vote_status = $(this).attr('class').split(' ')[1]; //gets second class name following vote_button
var vote_post_id = $(this).attr("id"); //the post ID
var dataString = 'post_id=' + vote_post_id + '&vote_status=' + vote_status;

$.ajax({
type: "POST",
url: "url/add_vote.php",
data: dataString,
cache: false,
success: function(html) {
if (vote_status == 1)
{
$('.msg_box').fadeIn(200);
$('.msg_box').text('You voted UP!');
}
if (vote_status == 2)
{
$('.msg_box').fadeIn(200);
$('.msg_box').text('You voted DOWN!');
}
}
});
return false;
});
});

示例 HTML

<div class="vote_button 1" id="18">UP</div>
<div class="vote_button 2" id="77">DOWN</div>
<div class="msg_box"></div>

<div class="vote_button 1" id="43">UP</div>
<div class="vote_button 2" id="15">DOWN</div>
<div class="msg_box"></div>


<div class="vote_button 1" id="11">UP</div>
<div class="vote_button 2" id="78">DOWN</div>
<div class="msg_box"></div>

编辑:提供了没有 Ajax 部分的 jsfiddle http://jsfiddle.net/XJeXw/

最佳答案

您需要在 click 处理程序中保存对按钮的引用(例如,var me = $(this);),然后使用 me。 nextAll('.msg_box:first') 在 AJAX 处理程序中。

编辑:Example :

var me = $(this);   //The this will be different inside the AJAX callback

$.ajax({
type: "POST",
url: "url/add_vote.php",
data: dataString,
cache: false,
success: function(html) {
me.nextAll('.msg_box:first')
.text(vote_status == 1 ? 'You voted UP!' : 'You voted DOWN!')
.fadeIn(200);
}
});

关于javascript - 用于单个 div 的 jquery 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4251793/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com