保存一个项目的点击次数，每个项目被点击

Question

目前我正在尝试为我的网页建立一个点赞计数器。
您可以在下方看到点击计数器。它完全正常工作。遗憾的是（但可以肯定的是）仅针对当前会话...是否有可能永远存储该值？

最后一件事！网站上不止一张喜欢的图片。所以我不知道如何使用 cookie 或 localstorage 存储这些值。

也许你有别的想法？也许没有 JS？

var currentValue = 0,
  count = $('.count');

$(document).ready(function() {
  count.each(function(i) {
    $(this).addClass('' + (i += 1));
  });
});



$('.heart').on('click', function(e) {
  var clickElement = $(this).find('.count');

  clickElement.html(parseInt(clickElement.html(), 10) + 1);
});

<p>Click on the Number to increase it by 1</p>

<a class="heart">
  <span class="icon"></span>
  <span class="count">0</span>
</a>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

页面上的内容如下所示：

Answer 1

您应该做的是将它们存储在数据库中。您应该将项目的 id 和当前计数发送到服务器，通过查询数据库检查项目的当前计数和是否存在，如果验证通过，将它们保存到数据库（更新或插入，取决于您的数据库方案）。

已更新

注意：在将值保存到数据库之前检查值的正确性非常重要。因此，通过在 $_POST 值中发送项目的当前点击计数来检查当前点击计数是可靠的。您确实应该做的是通过 $_POST 发送项目的 id，然后查看该项目是否存在，如果存在，请编写以下查询以使点击计数仅增加一个值：

UPDATE item_table SET (click_counter = click_counter+1) WHERE item_id = ?

这有几个特点：

它比常规 select+increment_in_php+更新快得多更快
它使用更少的系统资源
这是最可靠的递增方法，因为 while 处理 PHP 中的用户值，另一个请求可能只是更新了该值，因此您在 PHP 中的值不是最新的一。但是通过SQL，它已经知道最近的值是多少不会有这种碰撞。

如果您将 click_counter 作为 item_table 的一列并且您只需更新它，则上述方法和说明适用。但是我有一个建议给你（当然如果你没有实施这个）

创建一个table，例如，item_counts，然后是id、item_id、date_created等三列。您可以添加许多其他列，例如 user_ip、user_id（如果已通过身份验证）等

然后每次访问时，您只需在 table 中添加一条记录。这比以前的解决方案有几个特点：

与数据库原子性规则兼容。
您可以稍后对其进行分析。

您通过查询数据库得到click_counts：

SELECT COUNT(id) FROM item_counts WHERE item_id = ?

此解决方案的缺点是在呈现页面时您必须有一个额外的查询来获取项目的 click_counts。它当然需要更多 space 在服务器上，但如果你的项目不是一个小项目，这是值得的。然而，我个人从不试图扼杀项目规模的良好实践，如果这种实践很容易获得的话。

更新说明结束

您可以发送 ajax 请求：

var already_clicked = [];

$('.heart').on('click', function(e) {
  var clickElement = $(this).find('.count');
  var itemId = $(this).attr("data-id");
  // changes to current view in the page
  clickElement.html(parseInt(clickElement.html(), 10) + 1);


  // send an ajax request
  $.ajax({
     url : "server.php",
     data : { count : parseInt(clickElement.html(), 10),
            id :  },
     type : "POST",
     success : function(data){
        // do something in the success
     }
  });
});

现在您的 PHP 脚本应该如下所示

// using MySQLi extension
$db = new mysqli("localhost", "usr", "pass", "db");

if( isset($_POST["count"]) && isset($_POST["id"]) )
{
     if (check_if_the_count_is_ok($_POST["count"], $_POST["id"])) 
     {
       $new_count = $_POST["count"] + 1;
       $stmt = $db->prepare("INSERT INTO counts (count, id) VALUES(?, ?)");

       $stmt->bind_param("ii", $new_count, $_POST["id"]);
       $stmt->execute();

       echo json_encode([ "result" : true ]);
     }
     else
     {
      echo json_encode([ "result" : false]);
     }


}


function check_if_the_count_is_ok($item_count, $item_id)
{
     // write a select query to see if the count is true
}

注意：我假设您点击的项目包含一个名为 "data-id" 的属性，该属性包含要保存到数据库中的项目的 ID。

Answer 2

如果您在应用程序中使用数据库，请管理数据库中名为 lovit_count 的每张图片的计数，例如数据库中的列。然后为每个点击事件将该字段值增加或减少一。

加载页面时，您可以从数据库中加载该图片的点击次数。

保存一个项目的点击次数，每个项目被点击

Saving the click counts of an item each item it is clicked

javascript

php

count

save