file.txt中的PHP Like按钮计数器

Question

I would like to recreate several like button that saves count in a file.txt but that doesn't work :/ 我想重新创建几个类似的按钮，将计数保存在file.txt中，但不起作用：/

<?php

function getClickCount()
{
    return (int)file_get_contents("counter.txt");
}

function incrementClickCount()
{
    $counter = getClickCount() + 1;
    file_put_contents("counter.txt", $counter);
}
?>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<script type="text/javascript">
  var clicks = 0;

  function onClick() {
    clicks = 1;
    document.getElementById("clicks").innerHTML = clicks;
  };

</script>
<button type="button" onClick="onClick()" title="Vous aimez la couverture?" class="btn"><img id="heart" src="https://trello-attachments.s3.amazonaws.com/568304b85fa72dcb958a1edf/584acfc48b82595af77f2030/6257bf1efec79d5baf22309f8f327ce5/favorite.png" /></button>
<p><a id="clicks"><?php echo getClickCount(); ?></a></p>

DEMO HERE 此处演示

Thanks in advance for your help, I am looking since days on the web to find it but I don't... 在此先感谢您的帮助，自几天以来我一直在网上寻找它，但我没有...

Alexander 亚历山大大帝

Answer 1

counter.php counter.php

<?php

    function getClickCount() {
        return (int)file_get_contents("counter.txt");
    }

    function incrementClickCount() {
        $counter = getClickCount() + 1;
        file_put_contents("counter.txt", $counter);
    }

    if(!empty($_POST)) {
        if($_POST['click'] == 'true') {
            incrementClickCount();
            echo getClickCount();
        } else {
            echo getClickCount();
        }
    }

?>

counter.txt counter.txt

index.php index.php

<html>
   <head>
      <title>Click Counter</title>
   </head>
   <body>
      <button type="button" onClick="onClick()" title="Vous aimez la couverture?" class="btn"><img id="heart" src="https://trello-attachments.s3.amazonaws.com/568304b85fa72dcb958a1edf/584acfc48b82595af77f2030/6257bf1efec79d5baf22309f8f327ce5/favorite.png" /></button>
      <p><a id="clicks"></a></p>

      <script>
          function onClick() {
              loadClicks(true);
          }

          function loadClicks(isClicked) {
              var click = isClicked === true ? true : false;
              $.ajax({
                 url: 'counter.php',
                 type: 'POST',
                 data: {
                   'click': click
                 },
                 success: function(response) {
                   $('#clicks').text(response);
                 }
              });
          }

          loadClicks(false);
      </script>
   </body>
</html>

Code Explanation 代码说明

Whenever you click the button, there is an ajax request sent asynchronously in the background to counter.php . 每当您单击按钮时，都会在后台异步发送一个ajax请求到counter.php 。 This PHP file receives request and process accordingly. 该PHP文件接收请求并进行相应处理。

Here in the code, we send a single data to the PHP file in the ajax POST request which is a boolean data that is set based on the condition like if the button is clicked. 在代码中，我们将单个数据发送到ajax POST请求中的PHP文件，该数据是根据条件（例如，单击按钮）设置的布尔数据。

In PHP file, you will check a condition if the request is happened by button click or else other. 在PHP文件中，您将检查条件是否通过单击按钮或其他方式发生。 If it is by button, you will increment the click and send the click counter value in response else you will only send the value. 如果是按按钮，则将增加点击次数并发送点击计数器值作为响应，否则，您只会发送该值。

You will notice I've called loadClicks function with the parameter true in onClick function and false outside the function meaning that I first call the loadClicks(false) as soon as the script is started its execution to load only the clicks value and later when I click the button loadClicks(true) is invoked meaning increment and fetch the value. 您会注意到，我已经在onClick函数中调用了参数true loadClicks函数，在函数外部调用了false ，这意味着我首先在脚本开始执行时首先调用loadClicks(false) ，以仅加载clicks值，然后在我执行该操作时单击按钮loadClicks(true)被调用，意味着递增并获取值。

You will understand the code when you go through them carefully. 仔细阅读它们后，您将理解该代码。

Answer 2

At first glance, I see 3 problems with your script. 乍看之下，我发现您的脚本存在3个问题。

1) You are mixing JavaScript and PHP. 1）您正在混合使用JavaScript和PHP。 JavaScript runs on browsers and PHP runs on servers. JavaScript在浏览器上运行，PHP在服务器上运行。 If you want to exchange data between those parts of your script you need to make a server call from the JS part to the server, eg by using AJAX. 如果要在脚本的这些部分之间交换数据，则需要从JS部分向服务器进行服务器调用，例如使用AJAX。 A simple HTML request in JavaScript to a PHP script will work too. JavaScript中对PHP脚本的简单HTML请求也将起作用。

2) Also your <button> tag needs to be embedded in a <form> should point to a script to be executed (can be the same script). 2）同样，您的<button>标记也需要嵌入到<form>中，该标记应指向要执行的脚本（可以是相同的脚本）。

3) You never seem to call incrementClickCount() , at least not in the part shown here. 3）您似乎从来没有调用过incrementClickCount() ，至少在这里没有显示。

Suggestions 意见建议

The would code everything in PHP and then address the other two points. 会用PHP编写所有代码，然后解决另外两点。 Or you need to implement some form of client / server communication. 或者您需要实现某种形式的客户端/服务器通信。

file.txt中的PHP Like按钮计数器

问题描述

2 个解决方案

解决方案1
2 2016-12-10 14:14:19

解决方案2
0 2016-12-10 13:43:51

file.txt中的PHP Like按钮计数器

问题描述

2 个解决方案

解决方案1 2 2016-12-10 14:14:19

解决方案2 0 2016-12-10 13:43:51

解决方案1
2 2016-12-10 14:14:19

解决方案2
0 2016-12-10 13:43:51