1

ここで、no をカウントする JavaScript ボタン クリック カウンターを見つけました。ボタンのクリック数を記録し、その数を Web ストレージと呼ばれるものに保存しますが、それが実際に何であるかはわかりません。

このスクリプトが 1 台のコンピューターでしか機能しないことは確かです。つまり、ボタンを 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 を取得する必要があるページにアクセスし、次にクリックすると、カウントされて自動的に保存されます。

4

3 に答える 3

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 で実行します。

于 2012-09-29T08:14:22.777 に答える
1

ユーザーがページを閉じる前に「クリック」カウントをデータベースに保存する必要があります。そうしないと、カウントがゼロにクリアされます。次回別のユーザーがページを開いたときにカウントをデータベースに保存すると、前のカウント。あなたが言っていることを理解してくれることを願っています。ありがとう、スジャサン。

于 2012-09-29T07:38:29.520 に答える
0

あなたはローカルストレージについて誤解しています。ローカル ストレージは、サイトへの各訪問者に固有の情報をクライアント ブラウザーに保存する方法です。ユーザー間で共有されるサーバー データベースとはまったく異なります。あなたの場合、ユーザーAからの情報をサーバーデータベースに保存し、後でユーザーBがページをクリックしたときにそれを照会しない限り、ユーザーBがユーザーAがクリックした回数を知る方法はありません。

于 2012-09-29T07:42:42.223 に答える