我已经在谷歌上搜索了几个小时了,但我就是想不通。这是脚本:
<script type="text/javascript">
$(document).ready(function(){
$('article').readmore({
maxHeight: 75,
speed: 300,
moreLink: '<a href="#">Read more...</a>',
lessLink: '<a href="#">Read less...</a>'
});
$('.plus-button').click(function(){
var postid = $(this).data('postid');
$(this).siblings('.minus-button').removeClass('disliked');
$(this).toggleClass('liked');
$.ajax({
type:"POST",
url:"php/votesystem.php",
dataType : 'html',
data:'act=like&postid='+postid,
context: this,
success: function(data){
$(this).html(data);
}
});
});
$('.minus-button').click(function(){
var postid = $(this).data('postid');
$(this).siblings('.plus-button').removeClass('liked');
$(this).toggleClass('disliked');
$.ajax({
type:"POST",
url:"php/votesystem.php",
dataType : 'html',
data:'act=dislike&postid='+postid,
context: this,
success: function(data){
$(this).html(data);
}
});
});
$("#infobox").click(function(){
$(this).hide();
});
});
$("#loader").hide();
var load = 0;
var nbr = "<?php echo $nbr; ?>";
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height())
{
$("#loader").show();
load++;
if(load * 10 > nbr){
$("#messages").text("No more posts");
$("#loader").hide();
}
else{
$.post("php/newquery.php",{load:load},function(data){
$("#contentwrapper").append(data);
$("#loader").hide();
$('.plus-button').on("click", function(){
var postid = $(this).data('postid');
$(this).siblings('.minus-button').removeClass('disliked');
$(this).toggleClass('liked');
$.ajax({
type:"POST",
url:"php/votesystem.php",
dataType : 'html',
data:'act=like&postid='+postid,
context: this,
success: function(data){
$(this).html(data);
alert("Liked");
}
});
});
$('.minus-button').on("click", function(){
var postid = $(this).data('postid');
$(this).siblings('.plus-button').removeClass('liked');
$(this).toggleClass('disliked');
$.ajax({
type:"POST",
url:"php/votesystem.php",
dataType : 'html',
data:'act=dislike&postid='+postid,
context: this,
success: function(data){
$(this).html(data);
alert("Disliked");
}
});
});
$('article').readmore({
maxHeight: 75,
speed: 300,
moreLink: '<a href="#">Read more...</a>',
lessLink: '<a href="#">Read less...</a>'
});
});
}
}
});
</script>
PS:警报仅用于故障排除。
问题是,当新项目加载了脚本的无限滚动部分,并且我单击帖子项目时,每次单击其中任何一个,我都会收到两次"喜欢"或"不喜欢"的警告。我确实意识到我已经复制了脚本,但我需要在无限卷轴脚本的内部和外部都有脚本才能工作。文章只是一个阅读更多的插件(在无限滚动内外也需要这个)。我试着把东西搬来搬去,但似乎什么都不起作用。并澄清:我只有在新的职位加载后才有问题。无限卷轴外的第一个帖子运行良好。
newquery.php
<?php
session_start();
require_once("connect.php");
require_once("config.php");
$load = htmlentities(strip_tags($_POST['load'])) * 10;
$query = mysqli_query($connect,"SELECT * FROM posts WHERE totalupvotes < $trendmin AND deleted=0 ORDER BY added DESC LIMIT " . $load . ",10");
while($row = mysqli_fetch_array($query)){
$postloopid = $row['id'];
echo '<div id="postlist">
<div style="width:400px; font-size:18px; font-weight:bold;">
<a target="_blank" href="post.php?id=' . $row['id'] . '">' . $row['title'] . '</a>
</div><br />
<article class="slide">' . nl2br($row['post']) . '</article>
<br />';
include("votebox.php");
echo '
<br />
by <a style="font-size:18px;" href="profile.php?id=' . $row['submittedby'] . '">' . $row['submitteduser'] . '</a>';
echo ' at <span style="font-size:12px;">' . $row['added'] . '</span><span style="float:right; margin-right: 10px;"><a target="_blank" href="post.php?id=' . $row['id'] . '#commentfield">' . $row['totalcomments'] . ' comments</a></span></div>';
}
?>
Votebox.php包含在所有列出的帖子中:
<?php
// If postid is from frontpage use $postloopid as $postid
if(isset($postloopid)){
$postid = $postloopid;
}
include("connect.php");
// If user logged in show votebox
if(isset($_SESSION['username'])){
$userid = $_SESSION['userid'];
$sql2 = mysqli_query($connect,"SELECT * FROM posts WHERE id='$postid' AND deleted=0");
if($sql2){
$voterow = mysqli_fetch_assoc($sql2);
$checkupvote = $voterow['upvoters'];
$checkdownvote = $voterow['downvoters'];
$checkupvote = explode(" ",$checkupvote);
$checkdownvote = explode(" ",$checkdownvote);
if($checkupvote = array_search($userid,$checkupvote) == true){
echo '<div class="voteboxwrapper">';
echo '<div class="plus-button liked" data-postid="' . $postid . '" name="like">+ ' . $voterow['totalupvotes'] . '</div>';
echo '<div class="minus-button" data-postid="' . $postid . '" name="dislike">- ' . $voterow['totaldownvotes'] . '</div>';
echo $postid;
echo '</div>';
}
elseif($checkdownvote = array_search($userid,$checkdownvote) == true){
echo '<div class="voteboxwrapper">';
echo '<div class="plus-button" data-postid="' . $postid . '" name="like">+ ' . $voterow['totalupvotes'] . '</div>';
echo '<div class="minus-button disliked" data-postid="' . $postid . '" name="dislike">- ' . $voterow['totaldownvotes'] . '</div>';
echo $postid;
echo '</div>';
}
else{
echo '<div class="voteboxwrapper">';
echo '<div class="plus-button" data-postid="' . $postid . '" name="like">+ ' . $voterow['totalupvotes'] . '</div>';
echo '<div class="minus-button" data-postid="' . $postid . '" name="dislike">- ' . $voterow['totaldownvotes'] . '</div>';
echo $postid;
echo '</div>';
}
}
else {
echo 'No result <br />';
}
}
else {
echo 'Cant find user';
}
?>
有什么想法吗?
编辑:我已经尝试了.off()和.ubind()所有我能想到的方法。我仍然会得到"喜欢"one_answers"不喜欢"的两个和三个弹出框(应该只有1个)。除了解除绑定之外还有什么想法吗?
第2版:用新建议更新了所有脚本。仍然不起作用。
您不想使用$('.plus-button').click(...
,而是希望使用$('.plus-button').one('click', ...
,顾名思义,它只绑定一次!
请参阅官方文档
尝试将$(window).scroll.....
移动到文档就绪功能之外