代码的php部分:
//the JS part
echo "<script>
function increasevotes(e,location,user,date,vote)
{
e.preventDefault();
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
e.target.parentNode.previousSibling.textContent=this.responseText;
}
};
xmlhttp.open(\"GET\", \"vote.php?location=\" + location + \"&user=\"+ user +\"&date=\"+date+\"&vote=\"+vote, true);
xmlhttp.send();
}
</script>"
//the HTML part
echo "<span class=\"right nolikes\">{$rows['vote']}</span>
<a href=\"\" onclick=\"increasevotes(event,'{$rows['title']}','{$rows['username']}','{$rows['date']}','{$rows['vote']}')\">
<img src=\"img/like.png\" class=\"right\" width=\"30\" height=\"30\"/>
</a>"
在AJAX调用中使用的php。 (vote.php)
<?php
include("configure.php");
$location = $_REQUEST["location"];
$username = $_REQUEST["user"];
$date = $_REQUEST["date"];
$vote=$_REQUEST["vote"]+1;
$query="UPDATE journals SET vote={$vote} WHERE title='".$location."' AND username='".$username."' AND date='".$date."'";
$qresult=mysqli_query($conn,$query);
echo $vote;
?>
问题:
最初,数据库包含为零的投票。因此,显示了类似的图像和0。当我点击相似的图像时,数据库中的投票值增加1,并且在html页面中也会更新。但是,再次点击相同的符号不会将投票数增加到两个。为什么呢?
答案 0 :(得分:4)
原因是在你的JS回调中你只更新了
的文本<span class="right nolikes">{$rows['vote']}</span>
这一行:
e.target.parentNode.previousSibling.textContent=this.responseText;
但您还需要更新onclick部分的投票金额:
<a href="" onclick="increasevotes(event,'{$rows['title']}','{$rows['username']}','{$rows['date']}','{$rows['vote']}')">
here it still uses old vote number
我建议你在SQL和PHP部分中进行,而不是将当前的投票数量传递给PHP。
所以在你的php部分中代替$vote=$_REQUEST["vote"]+1;
执行此操作:
$query="UPDATE journals SET vote=vote+1 WHERE title='".$location."' AND username='".$username."' AND date='".$date."'";
然后更新值,您可以快速执行或等到回叫,但将其更改为:
var oldVote = parseInt(e.target.parentNode.previousSibling.textContent);
e.target.parentNode.previousSibling.textContent= oldVote++;
还有更多方法可以解决这个问题,但我认为这可能会对您有所帮助。