0

我的网页上有一个仅循环一次的 gif，并且我已对其进行了设置，以便每次单击它时它都会重新加载（使用 onclick 效果）。我给这个 onclick 效果一个 800 毫秒的冷却时间，这是 gif 的持续时间，所以在它完成之前你不能重新加载 gif。我还在这个 gif 中添加了点击计数器效果，因此每次点击时它都会向计数器广告 +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>

这很好用，正如您从我网页的链接中看到的那样，但我想让点击计数器效果通用。我的意思是我希望将点击保存在一个文件夹中（可能在我数据库的主文件夹中），这样每次点击都会相互计算，这意味着点击会堆积起来。例如，如果我单击该按钮 10 次，而其他人（在完全不同的计算机/网络/区域上）单击该按钮 12 次，则总点击量为 22 次，依此类推。

您可以在此处找到指向我的网页的 JSFiddle 链接

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

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

提前感谢大家！

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

4

1 回答 1

0

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

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

当然，这只是一个“草稿”，您必须根据自己的需要对其进行修改，但它应该可以帮助您入门。您还必须将表和字段名称替换为数据库中的名称，但这是一般的想法。

于 2014-10-27T20:51:07.663 回答