jQuery实现社会化分享插件

最新推荐文章于 2025-06-19 09:13:16 发布

嵌入式园姐

最新推荐文章于 2025-06-19 09:13:16 发布

阅读量1.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.youkuaiyun.com/amyliyanice/article/details/59056865

js 专栏收录该内容

18 篇文章

订阅专栏

本文介绍了一个简单的社交分享组件实现方案，通过引入特定的JS库和CSS样式文件，实现了包括QQ、微信及微博在内的多种社交平台分享功能。文章通过具体代码展示了如何设置分享链接和图标，并提供了初始化分享功能的方法。

引入文件

<link rel="stylesheet" href="../libs/shareJs/css/share.min.css"/>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/social-share.min.js"></script>

html代码

<div class="social-share share" data-initialized="true">
    <a href="#" id="shareQQ" class="social-share-icon icon-qq"></a>
    <a href="#" id="shareWeiXin" class="social-share-icon icon-wechat"></a>
    <a href="#" id="shareWeiBo" class="social-share-icon icon-weibo "></a>
</div>

js代码

 //分享
    var title = $(".title").text();
    var content = $(".desc").text();
    var url = "../index/news/detail/?id="+id;
    socialShare('.social-share',{
            sites:['qq', 'weibo','wechat'],
            title:title,
            url:url,
            description:content
    });