jQuery实现社会化分享插件

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

 98601  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}分享到微信


相关插件-独立的部件

jquery-ui改良版

jquery-ui或许你都看厌了那些ui,改良后的ui较为现代化
  独立的部件
 40277  352

jQuery自动定位当地天气预报

jQuery调用新浪天气,显示城市天气气温风向风级图标白天夜间
  独立的部件
 62981  438

新浪天气、时间获取插件

LeoWeather 是一款专门用来获取天气和时间的插件,本插件自创的标签模式使得用户可以更好的对显示内容进行排版!
  独立的部件
 57612  501

jQuery前端excel导入插件xlsx.core.js

此插件作用可以把excel表,导入到网页中用table显示出来
  独立的部件
 57261  417

讨论这个项目(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邮箱分享

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