- 所在位置：
- 首页 >
- 编程技术 >
- JavaScript >
- 用jQuery怎样实现心型点赞加一的效果？
用jQuery怎样实现心型点赞加一的效果？
Admin 2022-01-18 群英技术资讯 402 次浏览
这篇文章给大家分享的是用jQuery怎样实现心型点赞加一的效果。对于点赞的功能想必大家都不陌生吧，下文给大家介绍一下简单的实现点赞效果的示例，感兴趣的朋友可以参考，接下来就跟随小编一起了解看看吧。
本文操作环境：Windows7系统、jquery-3.3.1版、DELL G3电脑
jQuery怎么实现点赞加1？
Jquery一个简单的点赞效果，实现点赞数+1
1、导入JS
<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
2、CSS代码
a{
text-decoration:none ;
color: #999999;}.red{
color: red;}3、HTML代码
<p>王思葱竟然也是舔狗？<a href="#"><span class="liker">999</span></a></p>
<p>震惊，一名科学家发现每刷一分钟抖音，人的生命就会减少60秒！<a href="#"><span class="liker">520</span></a></p>
4、JS代码
$(function(){
//点赞
$(".liker").on("click",function(){
// 判断是否已经点赞过
if($(this).hasClass("red")){
return
}
//添加样式 并且数字+1
$(this).addClass("red")
var num=$(this).html().substring(1)
num++
$(this).html(""+num)
//ajax更新数据
})}) 运行…
单击小爱心后
以上就是关于是用jQuery实现心型点赞的效果的介绍，本文只是提供了一种实现思路，代码仅供参考，需要的朋友可以了解看看，当然，这里没有写后台交互的代码，想要了解更多可以继续浏览群英网络其他相关的文章。
文本转载自PHP中文网
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。
猜你喜欢
-
Js模块打包有几种方式，存在哪些区别
这篇文章主要介绍了Js模块打包exports require import的用法和区别，对模块打包感兴趣的同学，可以参考下
-
怎么样用Vue写一个可复用轮播组件
这篇文章主要为大家详细介绍了Vue实现可复用轮播组件的方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
-
微信小程序中怎样实现切换页面的效果？
这篇文章给大家分享的是有关微信小程序实现切换页面的内容。小编觉得挺实用的，因此分享给大家做个参考，这里要实现的需求是，点击导航条可以切换部分页面，具体的实现效果如下，感兴趣的朋友就继续往下看吧。
-
vue导入一个组件及使用，另一组件不显示怎样办
目录组件引用另一个组件出现组件不显示vue声明了一个组件,但是没有显示组件引用另一个组件出现组件不显示下载的一个vue构建的后台管理系统，导航栏是一个侧边栏，想在头部里面加一个导航先是导入要使用的组件import Hamburger from @/components/Hamburgerimport Nav from
-
Nodejs与Python进行双向通信过程是什么
最简单粗暴的通信方式是 Nodejs调用一下 Python 脚本，本文详细介绍了Nodejs与Python 双向通信的实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
推荐内容
成为群英会员,开启智能安全云计算之旅
立即注册
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008
