jQuery实现社会化分享插件

所属分类:其他-独立的部件

 98530  527  查看评论 (24)
分享到微信朋友圈
X
jQuery实现社会化分享插件 ie兼容9

此插件是基于jquery的,因此需要先引入jquery文件,之后在引入样式及js文件:

<link rel="stylesheet" href="css/share.css" type="text/css" />
<script src="js/share.js" type="text/javascript"></script>

组件分享

组件的方式使用,代码如下:

<div id="socialShare"></div>
 $(function() {
     $("#socialShare").socialShare({
           content: '自己动手编写jquery插件',
           url:'http://kiritor.github.io/2015/09/28/shiro-Authentication/',
           titile:'自己动手编写jquery插件title'
     });
 });

单独分享

也可以自己定义单个按钮的样式,独立分享,例如:

<a id="shareQQ" class="className">分享到QQ空间</a>$("#shareQQ").on("click",function(){
    $(this).socialShare("tQQ");
})

插件提供一些单独的分享方法,当然也可以自己定义参数

$("#shareQQ").on("click",function(){
    $(this).socialShare("tQQ",{
        url:'',
        content,'',
        title:''
    });
})

参数

当前支持4个参数:

{
    url: '分享的网址',  
    title: '分享的标题',
    content: '内容',
    pic: '图片'}

参数为可选,其中url和title的默认值为当前页面的url和title

方法

方法名参数描述
initparam:{url,content,title,pic}初始化插件
tQQparam:{url,content,title,pic}分享到腾讯微博
qZoneparam:{url,content,title,pic}分享到QQ空间
sinaWeiboparam:{url,content,title,pic}分享到新浪微博
doubanShareparam:{url,content,title,pic}分享到豆瓣
weixinShareparam:{url,content,title,pic}分享到微信


相关插件-独立的部件

canvas实现的步骤流程插件

项目需要,找不到合适的,个人编写实现,可根据数据动态生成节点
  独立的部件
 32074  340

mui搜索列表添加热门等模块

利用mui搜索列表的源代码,加入我们需求的热门等模块
  独立的部件
 28604  299

CSS3开关切换按钮

多组超具创意的CSS3开关切换按钮
  独立的部件
 42178  500

jQuery二维码生成插件qrcode.js

应用小工具二维码生成
  独立的部件
 40386  477

讨论这个项目(24)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    纽仁信息 0
    2018/8/28 10:37:45
    我这边 调用怎么报错 回复
    肥肥猫. 0
    2018/6/14 22:25:22
    谢谢分享 确实牛逼 回复
    AI 0
    2017/9/2 18:04:23

    请问下 怎么兼容ie8这朵奇葩

    回复
    oktmy 0
    2017/7/17 17:12:41

    不能分享到微信吗

    回复
    ?=殇~旋律?? 0
    2017/6/9 10:51:58

    分享成功后的成功回调怎么获取啊?

        HyGeek Cheung(张和杰)0
        2017/6/15 2:36:12
        我也想问
    回复
    better明天更好 0
    2017/5/20 14:09:26

    上面给的示例组件分享里面的   title  字段写错了

    回复
    雪…阴冷 0
    2017/2/24 10:52:51

    为什么不能分享到QQ

    回复
    朕略萌 0
    2017/2/17 13:42:00
    请问有人试过分享到qq空间的吗 回复
    sky 0
    2017/1/11 11:01:06
    跳转的URL链接,如果存在=或者是&等特殊符号的好,好像是自动截取了,然后就报错了。比如:{ url : 'http://baidu.com/index.php?m=home&c=NewYears&a=index' },这样的话就会截取到第一个=号那块,后面的都没有了,哪位大神有解决的办法?
        雪…阴冷0
        2017/2/24 10:54:03
        将要传的地址转义
        小楠人gjn0
        2017/6/7 18:15:52

        怎么 转义

    回复
    ???流浪的野马★★ 0
    2016/11/29 17:11:06
    分享到邮件参数怎么改
        小孔成像技术1
        2017/1/9 14:01:10

        在js中添加一个邮件事件,然后分享地址配置成

        http://mail.qq.com/cgi-bin/qm_share?url

        这个是qq邮箱分享

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复