简体   繁体   English

如何获得一个按钮被单击的次数的变量,将其在线存储然后在以后访问?

[英]How do I get a variable of the number of times a button has been clicked, store it online and then access it later?

I am trying to have a button that can be clicked and will then display the number of times it has been clicked. 我试图有一个可以单击的按钮,然后将显示它被单击的次数。 I want the variable, let's call it x, to be stored online, so that if one person clicks the button 5 times and then another person later clicks it an additional 3 times each screen will then display x as 8. I attempted local storage but that only stores the variable on the browser. 我希望将该变量(称为x)在线存储,以便如果一个人单击按钮5次,然后另一个人随后单击它,则每个屏幕另外3次将x显示为8。我尝试了本地存储,但是仅将变量存储在浏览器上。 I have been doing some research and it seems like I will have to store x on a file and then access it with an XMLHttpRequest. 我一直在做一些研究,似乎我必须将x存储在文件中,然后使用XMLHttpRequest访问它。 I am very new at Javascript and am not sure how to do this. 我是Java语言的新手,不确定如何执行此操作。 Could someone please respond with code that would achieve this and an explanation of what I will have to do to store the variable? 有人可以用实现此目的的代码作为响应,并说明存储该变量将要做什么吗?

For the Javascript side of it, you can use jQuery to make things a little easier 对于Javascript方面,您可以使用jQuery使事情变得简单一些

 $(document).ready(function() { /* perform AJAX XMLHttpRequest */ $.get("/click_count.php", function(data) { /* write the response into the HTML document */ $("#click_count").text(data); }); }); function save_click() { /* perform AJAX XMLHttpRequest */ $.post("/save_click.php", function(data) { /* write the result to the HTML document */ $("#click_count").text(data); }); } 
  <!-- include jQuery library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <html> <body> <button onClick="save_click();">click me!</button> Button has been clicked: <span id="click_count">0</span> times! </body> </html> 

Finally, you need to have two files (or one that does two things) which take advantage of a server-side technology. 最后,您需要有两个利用服务器端技术的文件(或一个做两件事的文件)。

The way the Server-side code works is like this: 服务器端代码的工作方式如下:

The clicks are stored in a file called click_count.data 点击次数存储在名为click_count.data的文件中

whenever anybody visits the file click_count.php , it simply reads the click_count.data file and sends whatevers in it as the response. 每当有人访问文件click_count.php时 ,它只会读取click_count.data文件并发送其中的任何内容作为响应。

Then, there's another file called save_click.php , which takes whatever is in click_count.data and then increases it by one before sending it back. 然后,还有一个名为save_click.php的文件,该文件接收click_count.data中的内容 ,然后将其增加一个,然后再发送回去。

The Javascript AJAX requests use these two files to save data on the server rather than on a per-client basis. Javascript AJAX请求使用这两个文件将数据保存在服务器上,而不是基于每个客户端。

For server-side, I've chosen to use PHP 对于服务器端,我选择使用PHP

File: click_count.php 档案: click_count.php

 <?php 

    /* print out the contents of the file 'click_count.data' */
    print_r(file_get_contents("click_count.data"));
  ?>

File: save_click.php 档案: save_click.php

 <?php  

   /* grab the current click count from click_count.data */
   $click_count = intval(file_get_contents("click_count.data"));

   /* increase it by 1 */
   $click_count++;

   /* write the new value into the file */
   file_put_contents("click_count.data", $click_count);

   /* print out new click count */
   print_r($click_count);

?>

Last file: click_count.data 上一个文件: click_count.data

 0

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 我如何获得一个按钮来执行多项任务,具体取决于单击了多少次? (JavaScript) - How can i get one button to do multiple tasks depending on how many times it has been clicked? (Javascript) 如何使按钮显示在javascript中单击的次数? - How do I make a button display the number of times it's been clicked in javascript? 如何存储单击按钮的次数? - How to store number of times a button was clicked? 如何获得已单击的Div的名称? - How do I get the name of a Div that has been clicked? 显示按钮被点击的次数 - Displaying how many times a button has been clicked 如何跟踪和显示所有用户点击按钮的总次数? - How can I keep track of and display the amount of times a button has been clicked in total by all users? 如何计算一个按钮在网站上被点击的次数? - How can I count the amount of times a button has been clicked on a website? 如何添加一个计数器来显示一个 div 元素被点击了多少次? - How do I add a counter to show how many times a div element has been clicked? 为什么在 output 处无法获取计数器的值? 它显示为“上面的按钮已被点击 {{ counter }} 次。” - Why I can't get the value of counter at output? It is showing like "The button above has been clicked {{ counter }} times." 在Vue中单击按钮后如何设置超时 - How do I set timeout after button has been clicked in vue
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM