在这里,我找到了一个JavaScript按钮点击计数器,用于计算编号。点击按钮并将数字保存在称为网络存储的内容中,我不知道究竟是什么。
有一件事我确定这个脚本只适用于一台计算机,这意味着如果我点击按钮10次,那么如果任何其他访问者点击该按钮,它将不会显示我之前点击过的点击次数。
现在我需要的是,无论如何使用javascript或php,点击次数应该保存在我的服务器的文本文件中,以后当任何其他访问者访问HTML页面时,他也应该得到相同的数字存在于文本文件中。
这里是带有代码的HTML
页面。
<!DOCTYPE html>
<html>
<head>
<script>
function clickCounter()
{
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have clicked the button " + localStorage.clickcount + " time(s).";
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
}
}
</script>
</head>
<body>
<p><button onclick="clickCounter()" type="button">Click me!</button></p>
<div id="result"></div>
<p>Click the button to see the counter increase.</p>
<p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p>
</body>
</html>
以简单的方式,
HTML页面上有一个按钮。
如果访问者A点击了5次并关闭了该页面。
之后,访问者B首先访问他应该获得数字5的页面,然后当他点击时,它应该被计算并自动保存。
答案 0 :(得分:2)
这是一件简单的事情。这个答案来自w3schools。这里使用了AJAX和PHP。为了保存该值,我们使用名为“vote_result.txt”的文本文件。
<强>的index.html 强>
<html>
<head>
<script type="text/javascript">
function getVote(int)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("poll").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","poll_vote.php?vote="+int,true);
xmlhttp.send();
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have voted " + localStorage.clickcount + " times before this session";
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
}
}
</script>
</head>
<body bgcolor=#5D003D>
<div id="poll">
<p>Click the button to see the counter increase.</p>
<p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p><form>
<input type="Button" class="voteButton" name="vote" value="Vote" onclick="getVote(this.value)" />
</form>
</div>
</body>
</html>
<强> poll_vote.php 强>
<?php
$vote = $_REQUEST['vote'];
//get content of textfile
$filename = "poll_result.txt";
$content = file($filename);
//put content in array
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];
if ($vote == 0)
{
$yes = $yes + 1;
}
if ($vote == 1)
{
$no = $no + 1;
}
//insert votes to txt file
$insertvote = $yes;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>
<table>
<tr>
<td><div id="votesMsg">Total Votes :</div></td>
<td><div id="votesCounter">
<?php echo($yes); ?></div>
</td>
</tr>
</table>
<input type="Button" class="voteButton" name="vote" value="Vote again !!!" onclick="getVote(this.value)" />
然后在工作目录中,创建一个名为poll_result.txt的文件
多数民众赞成。现在在localhost中运行此页面。
答案 1 :(得分:1)
您应该在用户关闭页面之前将“点击”计数存储到您的数据库中,否则计数将清零。如果您在下次其他用户打开页面时将计数存储在数据库中,您可以开始点击从前一次算起。我希望你得到我说的话。谢谢sujathan。
答案 2 :(得分:0)
您对本地存储存在误解。本地存储是一种将信息存储到客户端浏览器的方式,该浏览器对于您站点的每个访问者都是唯一的。它与用户之间共享的服务器数据库完全不同。在您的情况下,用户B无法知道用户A点击了多少时间,除非您将用户A中的信息存储到服务器数据库中,并在用户B点击页面后再查询。