开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

只能点赞一次js代码

要实现一个“只能点赞一次”的功能，可以使用JavaScript来控制用户在页面上的点赞行为。以下是一个简单的示例代码，展示了如何实现这一功能：

基础概念

前端开发：使用HTML、CSS和JavaScript等技术构建用户界面。
事件监听：通过JavaScript监听用户的点击事件。
本地存储：使用浏览器的localStorage来存储用户的点赞状态。

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>只能点赞一次</title>
    <style>
        .liked {
            color: red;
        }
    </style>
</head>
<body>
    <button id="likeButton">点赞</button>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const likeButton = document.getElementById('likeButton');

            // 检查本地存储中是否已经点赞
            if (localStorage.getItem('hasLiked') === 'true') {
                likeButton.classList.add('liked');
                likeButton.disabled = true;
            }

            // 监听点击事件
            likeButton.addEventListener('click', function() {
                // 设置本地存储，标记为已点赞
                localStorage.setItem('hasLiked', 'true');
                likeButton.classList.add('liked');
                likeButton.disabled = true;
                alert('感谢你的点赞！');
            });
        });
    </script>
</body>
</html>

优势

用户体验：明确告知用户已经点赞，避免重复操作。
简单实现：使用前端技术即可完成，无需后端支持。
持久化状态：通过localStorage保存点赞状态，即使刷新页面也不会丢失。

类型

前端控制：完全在前端实现，依赖浏览器的本地存储。
后端验证：通过服务器记录用户的点赞状态，更为安全和可靠。

应用场景

社交媒体：用户对帖子或评论进行点赞。
投票系统：确保每个用户只能投一次票。
反馈机制：用户对产品或服务的满意度进行评价。

可能遇到的问题及解决方法

用户清除缓存：如果用户清除了浏览器缓存，localStorage中的数据会丢失。
- 解决方法：结合后端验证，确保即使本地数据丢失，服务器端也能识别用户的点赞状态。

跨设备问题：用户在不同设备上登录，可能会重复点赞。
- 解决方法：使用用户的唯一标识（如用户ID）在后端进行验证，确保全局唯一性。

通过上述方法，可以有效实现“只能点赞一次”的功能，并处理一些常见的边缘情况。

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

JS实现只能调用一次的函数

目标我们的想法是一个函数只有第一次调用的时候有效，如下： function foo() { console.log('Hello world') } foo() foo() foo() 毋庸置疑...那么之后我们就可以这样写： const foo = once(() => { console.log('Hello from foo') }) foo() foo() foo() 无论调用多少遍只会执行第一次

2.3K1 0

QQ空间自动点赞代码

使用方法进入QQ空间网页版，并且登录复制以下代码 var x=5,y=10; function autoClick() { y=y+5; var zan...window.scrollBy(x,y); } window.setInterval(autoClick,2000); 按f12 进入console 粘贴如果嫌慢的话可以修改上面的这段代码

27.3K2 0

【Auto.js】QQ名片点赞

"auto"; function 下滑(){ className("AbsListView").scrollable().scrollForward(); } function 赞(){ var like...= className("ImageView").desc("赞").find(); if(like){ like.click(); return true; } return false; } function...显示更多(){ for(let i = 0; i < 2;i++){ click("显示更多"); } } toast("请打开自己的资料页，点击点赞图标"); sleep(100); waitForActivity...com.tencent.mobileqq.activity.VisitorsActivity"); while(notStopped()){ var i = 0; while(i < 10){ i += 赞(

4.2K3 0

QQ空间自动点赞代码

前言原文地址：https://blog.ascv.cn/archives/41.html　每逢节假日，总有朋友同学发说说，求关注，自己又没时间去点赞。...现在让我们来在QQ空间控制台加上一段代码　一段Javascript代码，让电脑自动为我们点赞。...}; window.scrollBy(x,y); } window.setInterval(autoClick,2000);----使用方法1：进入QQ空间2：复制代码...3：按f12 进入控制台也就是console4：粘贴回车喝口水如果嫌慢的话可以修改这段代码window.setInterval(autoClick,2000);复制代码//2000代表两秒屏幕下滑

4.8K6 0

typecho点赞实现代码分享

archive->request->do_action){ likeup($archive->request->likeup,$archive->request->do_action); exit; } } //点赞函数...$cid, ""); } echo $num; } post请求参数 likeup：文章id do_action：do或者undo likeup是指定文章id的，do_action是点赞动作，动作为do...为点赞，undo为取消点赞！...前端方面前端方面需要写ajax请求接口的函数，然后在post.php里加入按钮，点击按钮传递文章id与动作触发相关点赞或者取消点赞效果。...关于点赞数在post.php里添加cid,'kkb'); ?>即可显示点赞数，同时ajax动作请求完成也会返回点赞数。 linkCard('.post-content','0');

6382 0

Auto.js实现视频号自动点赞

最近在学脚本开发，今天终于有小有所成，写了一个微信视频号自动点赞的功能，以下是代码实现，特此记录。...function goodClick(){ // 点赞的容器 let goodBox = id("com.tencent.mm:id/a2s").findOne(); //...点赞的图标 let goodIcon = goodBox.children().findOne(id("com.tencent.mm:id/f1x")); // 点击的范围 let...:id/fnp")); // 点赞前文字 let num1 = goodNum1.text() - 0; // 开始来点赞 obj.click(); sleep...// 点赞后文字 let num2 = goodNum2.text() - 0; // 如果取消赞 if(num1>num2){ // 补回点赞

4.6K4 2

【Auto.js】为任何指定QQ好友点赞

/** * 为指定QQ点赞, 理论兼容所有安卓机...具体效果我也不知道,只在安卓7.0+版本测试了 * 如果有问题,群里说吧.QQ号码格式看下面 * 注意: 运行本脚本需要安卓7.0以上或者已经...root的设备,最低运行版本不建议低于安卓5.0 */ auto.waitFor(); var QQNum_Arry = [ //按照如下格式添加你要点赞的QQ号 "289986635",...com.tencent.mobileqq.activity.FriendProfileCardActivity"); sleep(3000); let Btn = descEndsWith("次赞"

1.5K2 0

Linus看了都点赞的一次Bug Fix

TencentOS 内核团队的 Patch 被公认为最佳修复， Linus Torvalds 更评价其"不明觉赞，祝顺利" 。本文将由浅入深解析底层原理，厘清问题来龙去脉。...这并不是我们第一次解决内核中的隐藏问题或疑难问题。...在审阅 Linux 内核核心路径代码时，我们注意到了这一冗余的 Tree Walk，并认为这一点作为内核最核心的路径之一，是非常值得优化的，因此经过几个迭代和测试，对插入逻辑进行了如下重构（已经合入 v6.10...新的插入逻辑确实更绕一点，不过在乐观情况下（实际测试中乐观情况占比几乎是绝对性的压倒的，即便是高压力的并发场景），若不涉及 split，只需要步骤 2 这里进行一次走树即可，这基本上已经是理论上的最佳方式...因为缺乏 reproducer，同时没有有效的 debug 信息，社区很大程度上也只能盲猜。就像开头我们已经介绍过的，这一问题让社区的几位 Maintainer 都颇为困惑。

2062 0

Auto.js实现朋友圈自动点赞

最近在学脚本开发，今天终于有小有所成，写了一个朋友圈自动点赞的功能，以下是代码实现，特此记录。...// 单个页面点击 function pageClick(){ // 整个页面"两点"集合 var twoDotList = id("com.tencent.mm:id/ik").find...(); // 循环操作每个"两点" twoDotList.forEach(item => { // 点击"两点" item.click();...// 等待"赞"出现 sleep(1500); // 获取"赞"控件 var good = text("赞").findOnce();...if(good){ // 获取"赞"父控件 var goodParent = good.parent(); goodParent.click

3.3K2 0

Python伪代码分析点赞器实现原理

许多社区类平台都具备点赞功能，应运而生的就是自动点赞器，今天用Python写一款点赞机器人，最简单易理解的核心逻辑。...全文涉及的伪代码，使用 Python 编写，由于是伪代码的原因，不懂Python，你也能看懂。一简介 1适用场景本次点赞机器人，主要面向电脑上的 Web 站点，不涉及 APP 端。...2核心逻辑模拟点击操作，触发点赞，喜欢等操作。实现点赞操作前，还有一步重要的代码实现，模拟登录。因此，点赞机器人的基本需求包括模拟登录、进行点赞；对该需求进行扩展后，存在两个常见的业务场景。...3点赞器伪代码实现伪代码实现如下：在调用点赞接口部分，你将碰到一个难点：接口中包含位置参数，例如上述的 B 站点赞链接中的 csrf，碰到未知参数的解决思路参考下述描述。...继续以B 站举例，打开浏览器开发者工具，切换到 network 选项卡，当点击点赞的时候，会出现点赞的数据请求，如下图所示。

6583 0

使用代码方式实现WordPress文章点赞功能

实现思路通过 ajax 实时显示点赞数量，自定义字段保存赞数量，Cookies 禁止重新点赞。...click", ".favorite", function() { $(this).postLike(); }); 修改文章页面single.php，在你需要的位置添加一个点赞按钮...> 通过上面的三段代码就已经实现文章点赞功能，但是样式效果惨不忍睹，作者还提供了下面的样式，添加到主题style.css中（下方样式xiaoz未经测试） .post-like...但如果您网站启用了CDN，或使用了WP-Super-Cache这类静态缓存插件后，页面会被提前缓存起来，这样判断也就失效了，便可以无限点赞，于是xiaoz进行了改进，通过js再判断一次COOKIES是否存在...; } else{ $(this).postLike(); } }); 总结最后实现的功能类似小z博客文章下方的点赞效果，这里主要提供思路和代码实现

1.1K1 0

Auto.js实现视频号点赞自动化

给大家分享一个自动化点赞视频号的功能，仅供大家学习参考，请勿滥用！基本实现思路： 1. 找到点赞图标和点赞数量的父容器A； 2. 通过父容器A找到点赞图标的可点击对象B； 3....点击可点击对象B进行点赞；正常来说，上面的操作已经完成了我们想要的功能，但是可能会因为人为的滑屏，将已经点赞了再次点击，变为了取消赞，所以要做下面的操作： 5....再次通过父容器A找到点赞数量D； 6. 比较点赞前的点赞数量C与点赞后的点赞数量D，如果数量C大于数量D说明之前取消了点赞，再次点击可点击对象B补回点赞； 7....滑屏循环上面的操作；以下是代码实现： function goodClick(){ // 点赞的容器 let goodBox = id("com.tencent.mm:id/a2s")...().findOne(id("com.tencent.mm:id/fnp")); // 点赞前文字 let num1 = goodNum1.text() - 0; // 开始来点赞

1.6K1 0

点赞收藏：PyTorch常用代码段整理合集

torch.cuda.manual_seed_all(0) 指定程序运行在特定 GPU 卡上在命令行指定环境变量 CUDA_VISIBLE_DEVICES=0,1 python train.py 或在代码中指定...mean=(0.485, 0.456, 0.406), std=(0.229, 0.224, 0.225)), ]) 训练基本代码框架...不需要计算梯度的代码块用 with torch.no_grad() 包含起来。...例如如果你想知道一个 epoch 中每个 mini-batch 的 loss 和准确率，先将它们累积在 GPU 中等一个 epoch 结束之后一起传输回 CPU 会比每个 mini-batch 都进行一次...统计代码各部分耗时 with torch.autograd.profiler.profile(enabled=True, use_cuda=False) as profile: ... print

1.8K2 1

点赞收藏：PyTorch常用代码段整理合集

机器之心转载来源：知乎作者：张皓众所周知，程序猿在写代码时通常会在网上搜索大量资料，其中大部分是代码段。然而，这项工作常常令人心累身疲，耗费大量时间。...所以，今天小编转载了知乎上的一篇文章，介绍了一些常用PyTorch代码段，希望能够为奋战在电脑桌前的众多程序猿们提供帮助！...不需要计算梯度的代码块用 with torch.no_grad() 包含起来。...例如如果你想知道一个 epoch 中每个 mini-batch 的 loss 和准确率，先将它们累积在 GPU 中等一个 epoch 结束之后一起传输回 CPU 会比每个 mini-batch 都进行一次...由于作者才疏学浅，更兼时间和精力所限，代码中错误之处在所难免，敬请读者批评指正。

1.7K5 0

【开放源代码】集齐转评赞！微博点赞详细信息抓取

微博的转评赞都是构成微博社交关系网络的重要组成部分，其中转发和评论都在之前的推送中发布过。...2021 微博最新转发爬虫发布 2021 新版微博评论及其子评论爬虫发布今天就来补齐赞的信息，并开放源代码，以李医生的最后一条微博为例子。...为给该微博点赞的用户的认证类型，-1 就是没用认证，普通用户。...0: '名人', 1: '政府', 2: '', 3: '媒体', 220: '' } 遗憾的是，测试发现，一条微博暂时只能抓到的赞上限在...# 每个 request 休眠 8 s slp_sec_per_req = 8 # 每个 request 连接超时 8 s timeout = 8 # 每翻 5 页保存一次

1.7K4 0

某音电脑端网页版自动回复、点赞之js脚本

所以弄个自动回复，点赞。需要先点击显示评论框。...setTimeout(handlerByPmouse, 3000, { type: "moveAndClick", x: x + 500, y: y + 360 }); //再次点击（和上一次形成双击...，点赞） setTimeout(handlerByPmouse, 3200, { type: "click" }); //setTimeout(handlerByPmouse, 4500...function init() { videoPlaying(); } eval(getScript("https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js...2 把上面的代码复制到油猴里面，然后就可以在edge里面刷短视频看效果了。

1.4K2 1

六、文章详情显示及点赞实现《iVX低代码无代码个人博客制作》

作为参数，到数据库中查找对应的评论信息即可：接着在详情页显示时增加调用该服务的操作，并且给予评论信息作为存储容器：此时我们预览之后，发现当前文章的评论结果已经显示：五、点赞实现...接下来我们增加一个点赞服务，接受一个文章数据ID以及一个点赞用户列表作为参数，当点赞动作发生时，添加当前用户到点赞用户列表更新到对应的点赞数据之中，表示当前用户已点击：此时那如何在页面中判断用户是否已经点击了呢...，我们先把对应文章发布页中的昵称变量放到外部：当点击的时候判断当前昵称是否存在点赞用户列表，如果不存在则加入，并且更新用户点赞列表，否则将提示未登录或已点赞：此时我们回到详情页，点击后并没有任何反应...，但是在数据库中已存在点赞用户：那么此时点赞后应该在前端有所显示，我们直接在点赞用户外添加一个 if 容器，把点赞操作放到if 之中，并且设置文本若当前用户昵称不属于点赞用户列表，那么就可以点赞...：如果属于的话我们就显示已点赞，并且不生效事件：此时我们再访问内容，会出现已点赞提示：

4494 0

一天显示一次广告JS代码

function setUCookie(u_name,value){ var exdate=new Date() exdate.setHours...

4.8K4 0

ImageNet识别率一次提高1%：谷歌AI新突破引Jeff Dean点赞

近日，Quoc Le 等提出了一个新的方法，在这一数据集上再次提高了 SOTA 性能一个点。而且这一方法让模型在鲁棒性上也有很大的提升。...这一自训练模型，能够在 ImageNet 上达到 87.4% 的 top-1 精确度，这一结果比当前的 SOTA 模型表现提高了一个点。

8499 0

ImageNet识别率一次提高1%：谷歌AI新突破引Jeff Dean点赞

近日，Quoc Le 等提出了一个新的方法，在这一数据集上再次提高了 SOTA 性能一个点。而且这一方法让模型在鲁棒性上也有很大的提升。...这一自训练模型，能够在 ImageNet 上达到 87.4% 的 top-1 精确度，这一结果比当前的 SOTA 模型表现提高了一个点。

3462 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭