我一直在Google上搜索幾個小時,但我無法弄清楚。這是腳本:jquery點擊函數觸發兩次的問題
<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()和.unbind()所有我能想到的方法。我仍然得到「喜歡」和「不喜歡」的雙重和三重彈出窗口(應該只有1個)。任何想法除了解除綁定和關閉?
編輯2:用新建議更新了所有腳本。仍然不工作。
你試過結合之前解除綁定click事件的?最有可能的是雙重限制。 – zmanc 2014-08-31 01:05:36
不,你怎麼做到的?我並沒有真的做jquery。腳本通過我的noob知識下載和定製。 – 2014-08-31 01:07:32
@SindreSørensen要刪除一個事件監聽器,可以使用[**'off()'**](http://api.jquery.com/off/),或者根據你的jQuery版本,使用[**'unbind )'**](http://api.jquery.com/unbind/)(從1.7折舊)。 – 2014-08-31 01:13:18