2012-07-19 2 views
1

사용자 게시물에 대해 간단한 Ajax 투표 스크립트를 작성했습니다 (+1 및 -1). 모든 것이 정상적으로 작동하지만 때로는 데이터가 +3, +6, -2 등의 이유로 어떤 이유로 클릭 한 번으로 Chrome 개발자 도구의 스크린 샷을 만들었습니다. 클릭 한 번을 PHP 스크립트라고 여러 번 부르는 것으로 나타났습니다. dot.gif - 데이터 전송 중 buzy 애니메이션. enter image description hereAjax가 데이터를 여러 번 보냅니다.

<script type="text/javascript" src="raitings/jquery.js"></script> 
<script type="text/javascript">$(function() {$(".vote").click(function() { 

var id = $(this).attr("id"); 
var name = $(this).attr("name"); 
var dataString = 'id='+ id ; 
var parent = $(this); 

if(name=='down') 
{ 
$(this).fadeIn(200).html('<img src="raitings/dot.gif" align="absmiddle">'); 
$.ajax({type: "POST", url: "raitings/down_vote.php", data: dataString, dataType : "html", cache: false, success: function(html) 
    { parent.html(html);} 
}); 
} 
else 
{ 
$(this).fadeIn(200).html('<img src="raitings/dot.gif" align="absmiddle">'); 
$.ajax({type: "POST", url: "raitings/up_vote.php", data: dataString, dataType : "html", cache: false, success: function(html) 
    { parent.html(html); 
    } }); 
} 
return false; 
    }); 
}); 
</script> 

<?php 
echo "<div class=\"box1\"><div class=\"up\"><a href=\"#\" class=\"vote\" title=\"+ 1\" alt=\"+ 1\" id=".$row["id"]." name=\"up\">".$up."</a></div>" 
."<div class=\"down\"><a href=\"#\" class=\"vote\" title=\"- 1\" alt=\"- 1\" id=".$row["id"]." name=\"down\">".$down."</a></div></div>\n"; 
+0

이 페이지가 동일한 컨테이너에 여러 번로드되는지 여부를 알려주십시오. 클릭 이벤트가 여러 번 등록 된 것처럼 보입니다. –

+0

이것은 PHP-Nuke의 이전 CMS입니다. 모듈 - 방명록이 있습니다. 각 게시 출력에 대한 모듈의 index.php에 위의 코드를 삽입했습니다. – Astraport

+1

jQuery .live() 메서드를 사용할 때 이러한 문제가 발생했습니다. 이러한 상황이 발생하면 .die()와 함께 사용하는 것이 유용 할 때도 있습니다. 그런 다음 .die()를 살펴보십시오. –

답변

1

사용자가 투표를하면 자신의 컨트롤을 해제해야합니다. "FUNCTION_NAME();"

$(function() { 
var isUserVoted = false; 
$(".vote").click(function() { 
    if (isUserVoted) { 
     return false; 
    } 

    isUserVoted = true; 
    var id = $(this).attr("id"); 
    var name = $(this).attr("name"); 
    var dataString = 'id='+ id ; 
    var parent = $(this); 

    if(name=='down') { 
     $(this).fadeIn(200).html('<img src="raitings/dot.gif" align="absmiddle">'); 
     $.ajax({type: "POST", url: "raitings/down_vote.php", data: dataString, dataType : "html", cache: false, success: function(html) 
    { parent.html(html);} 
     }); 
    } else { 
     $(this).fadeIn(200).html('<img src="raitings/dot.gif" align="absmiddle">'); 
     $.ajax({type: "POST", url: "raitings/up_vote.php", data: dataString, dataType : "html", cache: false, success: function(html) { parent.html(html); 
    } }); 
    } 
    return false; 
}); 
}); 
+0

감사합니다. 시도했지만 여러 데이터 전송을 계속합니다. – Astraport

+0

요점은 사용자가 동일한 페이지에서 여러 게시물에 투표 할 수있는 기회를주고 코드에 불가능하다는 것입니다. – Astraport

+0

모든 투표에 플래그 (일부 맵 등)를 작성하십시오. 사용자가 이미 투표 한 경우 서버에 데이터를 보내면 안됩니다. 또한 클래스 이름으로 DOM 요소를 검색하는 것이 가장 느린 방법입니다. – Serjio

-1

대신 JQuery와 클릭 이벤트에 onclick을 =을 작성하려고 : 그래서 그냥 몇 가지 차단 플래그 (등 변수, 쿠키 등) 추가 href ..

예 : ...

관련 문제