Html 如何制作通用点击计数器？

我在我的网页上有一个只循环一次的gif，我已经设置好了它，每次我点击它时它都会重新加载（使用onclick效果）。我已经给这个onclick效果一个800毫秒的冷却时间，这是gif的持续时间，所以在gif变亮之前你不能重新加载它。我还为这个gif添加了一个clickcounter效果，这样每次点击都会在计数器上显示+1。为了保证准确性和质量，我还为clickcounter效果提供了800毫秒的冷却时间，这意味着每0,8秒添加的时间不能超过（+1）。我使用了以下脚本：

Javascript

<script>
$(function(){
    var update_count = function () {
        $('#count-block').html("<h3><b>The rabbit has jumped " + image.click_count + " meters.</b></h3>");
    }
    var image = new Image();
    image.in_action = false;
    image.duration = 800;
    image.click_count = 0;
    update_count();
    image.src ='transparent.gif';
    $('#img').click(function(){
        if (!image.in_action) {
           image.in_action = true;
           image.click_count += 1;
           update_count();
           $(this).attr('src',image.src);
            window.setTimeout(function() {
                image.in_action = false;
            }, image.duration);

        }
    });
});
</script>

$（函数（）{
var update_count=函数（）{
$（'#count block'）.html（“兔子跳了”+image.click_count+“米”）；
}
var image=新图像（）；
image.in_action=false；
image.duration=800；
image.click_count=0；
更新_计数（）；
image.src='transparent.gif'；
$（'#img'）。单击（函数（）{
如果（！image.in_action）{
image.in_action=true；
image.click_count+=1；
更新_计数（）；
$（this.attr（'src'，image.src））；
setTimeout（函数（）{
image.in_action=false；
}，图像。持续时间）；
}
});
});

从我的网页上可以看到，这非常有效，但我想让clickcounter效果更具普遍性。我的意思是，我希望点击被保存在一个文件夹中（可能在我数据库的主文件夹中），这样每次点击都会相互记录，这意味着点击会堆积起来。例如，如果我点击按钮10次，而其他人（在完全不同的计算机/网络/区域上）点击按钮12次，那么总点击量将为22次，以此类推

您可以找到指向我的网页的JSFIDLE链接

我对脚本和HTML等相当陌生，因此需要粗略的解释。我还没有尝试过样式表或任何涉及第三方元素/文件夹等的东西（我相信这个项目需要），所以如果你能告诉我整个过程，我将不胜感激

如果需要的话，我会更详细地阐述我的偏好！请随意使用JSFIDLE链接并查看当前状态下的网页

提前感谢大家

---

（顺便说一句，我的数据库运行PHP）

这是我的建议，我还没有测试过它，所以我不是100%确定它能工作，而是使用jQuery创建一个隐藏的输入字段（我假设这是基于第一个函数使用的库）

---

当然，这只是一个“草稿”，你必须修改它以适应你的需要，但它应该让你开始。您还必须将表名和字段名替换为数据库中的名称，但这是一般的想法。

您可以详细说明一下吗？我应该把代码放在哪里？我应该在数据库中的什么位置插入该值？：）很抱歉，我不太懂html，我只是还不太懂html，我想把它做好！：）我感谢您的关心和帮助，非常感谢！您对PHP和MySQL的熟悉程度如何。你能给我举一个后端的例子吗？我对PHP或MySQL一点都不熟悉。我目前正在学校里做这件事，我们之前提到过MySQL工作台，但这就是我所知道的全部。至于后端，没什么可说的。我正在使用运行PHP的教师数据库（Inftek1.dyndns.org），仅此而已。我对数据库本身不太了解，但我知道我使用一个名为FileZilla的程序访问数据库文件夹以进行上传和编辑。如果这对我有帮助的话，我可能会找到一两件事，但是我需要问老师一些具体的问题：）非常感谢你的帮助

$("#img").append("<input type='hidden' name='counter' id='counter' value='" +image.click_count +"' />

    $counter = $_POST["counter"];
    **INSERTING THE CLICK COUNTS**
    mysqli_query($dbconnection, "INSERT INTO 'clicks'(`clicks`) VALUES('" .$counter ."');

$query = mysqli_query($dbconnection, "SELECT SUM(clicks) AS 'Clicks' FROM 'clicks');
while($row = mysqli_fetch_assoc($query){
    $clickNumber = "{$row['clicks']}";
}