Question

我的网页上有一个gif，它只循环一次，而且我已经设置它以便每次点击它时都会重新加载（使用onclick效果）。我给这个onclick效果一个800毫秒的冷却时间，这是gif的持续时间，所以你不能重新加载gif，直到它完成。我还为这个gif添加了一个clickcounter效果，这样每次点击它时它都会向计数器+1。出于准确性和质量的目的，我还给出了点击计数器效果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>

这很有用，你可以从这个link看到我的网页，但我想让clickcounter效果具有普遍性。我的意思是，我希望将点击保存在一个文件夹中（可能在我的数据库中的主文件夹中），这样每次点击都会相互计算，这意味着点击会叠加。例如，如果我单击按钮10次，而其他人（在完全不同的计算机/网络/区域上）单击按钮12次，则总点击次数将为22，依此类推。

您可以找到指向我的网页here

的JSFiddle链接

我对脚本和HTML等很新，所以需要粗略的解释。我还没有尝试过样式表或任何涉及第三方元素/文件夹等的东西（我相信这个项目需要），所以如果你能跟我说完整个过程，我就会感到高兴。

如果需要，我会进一步详细说明并详细说明我的偏好！随意使用JSFiddle链接并查看其当前状态的网页

提前感谢所有人！

（顺便说一下，这是值得的，我的数据库运行PHP）

Answer 1

这是我的建议，我还没有测试过，所以我不是100％确定它有效，但是使用jQuery创建一个隐藏的输入字段（我假设＆＃39;是您根据第一个功能使用的库。）

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

然后在PHP中，发布输入字段的值。然后将该值插入数据库，例如。

<强> PHP

    $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']}";
}

当然，这只是一个粗略的草案＆＃39;并且你必须改变它以满足你的需要，但它应该让你开始。您还必须用数据库中的内容替换您的表名和字段名，但这是一般的想法。

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

1 个答案: