微信js-sdk分享功能接口常用逻辑封装示例


Posted in Javascript onOctober 13, 2016

本文实例讲述了微信js-sdk分享功能接口常用逻辑封装。分享给大家供大家参考,具体如下:

微信js-sdk 1.0,分享说明:

1.目前支持的分享接口5个,其中分享腾讯微博基本可以忽略

2.接口只是定义分享时的数据,没有提供触发分享功能

一、在ready事件使用使用示例

//分享对象使用
var shareData={
  title:'分享标题',
  desc:'分享描述',
  link:'http://www.gongjuji.net',
  imgUrl:'http://www.gongjuji.net/favicon.ico',
  success:function(){
    appendText('分享成功');
  },
  //用户取消
  cancel:function(){
    appendText('分享取消');
  }
}
var share=new wxShare(shareData);
share.bind();

二、封装类定义:

//微信分享事件监听,常用功能封装
(function(){
var wxShare=function(opts){
  var defaults={
    title:'分享标题',//分享标题,不能为空
    desc:'',//分享描述,可以为空,(分享到朋友圈,不支持描述)
    link:'',//分享页面地址,不能为空
    imgUrl:'',//分享是封面图片,不能为空
    success:function(){},//分享成功触发
    cancel:function(){} //分享取消触发,需要时可以调用
  }
  this.opts=$.extend({},defaults,opts);
}
wxShare.prototype={
  //绑定微信朋友圈,发送朋友
  bindWX:function(){
    var _opts=this.opts;
    //监听,分享到朋友圈
    wx.onMenuShareTimeline({
      title:_opts.title,
      link:_opts.link,
      imgUrl:_opts.imgUrl,
      success:function(){
        if(_opts.success)
          _opts.success();
      },
      calcel:function(){
        if(_opts.cancel)
          _opts.cancel();
      }
    });
    //监听,分享给朋友 (type,dataurl基本可以放弃不使用)
    wx.onMenuShareAppMessage({
      title: _opts.title, // 分享标题
      desc: _opts.desc, // 分享描述
      link: _opts.link, // 分享链接
      imgUrl: _opts.imgUrl, // 分享图标
      success: function () {
        if(_opts.success)
          _opts.success();
      },
      cancel: function () {
        if(_opts.cancel)
          _opts.cancel();
      }
    });
  },
  //绑定QQ空间,QQ好友
  bindQQ:function(){
    var _opts=this.opts;
    //监听,分享到QQ空间
    wx.onMenuShareQZone({
      title: _opts.title, // 分享标题
      desc: _opts.desc, // 分享描述
      link: _opts.link, // 分享链接
      imgUrl: _opts.imgUrl, // 分享图标
      success: function () {
        if(_opts.success)
          _opts.success();
      },
      cancel: function () {
        if(_opts.cancel)
          _opts.cancel();
      }
    });
    //监听,分享到QQ
    wx.onMenuShareQQ({
      title: _opts.title, // 分享标题
      desc: _opts.desc, // 分享描述
      link: _opts.link, // 分享链接
      imgUrl: _opts.imgUrl, // 分享图标
      success: function () {
        if(_opts.success)
          _opts.success();
      },
      cancel: function () {
        if(_opts.cancel)
          _opts.cancel();
      }
    });
  },
  //绑定默认,不使用腾讯微博
  bind:function(){
    this.bindWX();
    this.bindQQ();
  },
  //绑定所有,包括腾讯微博
  bindAll:function(){
    this.bind();
    var _opts=this.opts;
    //监听,分享到腾讯微博 (基本可以放弃不使用)
    wx.onMenuShareWeibo({
      title: _opts.title, // 分享标题
      desc:_opts.desc, // 分享描述
      link: _opts.link, // 分享链接
      imgUrl:_opts.imgUrl, // 分享图标
      success: function () {
        if(_opts.success)
          _opts.success();
      },
      cancel: function () {
        if(_opts.cancel)
          _opts.cancel();
      }
    });
  }
}
window.wxShare=wxShare;
})();

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js本身的局限性 别让javascript做太多事
Mar 23 Javascript
10个实用的脚本代码工具
May 04 Javascript
网站页面自动跳转实现方法PHP、JSP(下)
Aug 01 Javascript
jquery插件开发注意事项小结
Jun 04 Javascript
js有序数组的连接问题
Oct 01 Javascript
javascript日期验证之输入日期大于等于当前日期
Dec 13 Javascript
javascript jquery对form元素的常见操作详解
Jun 12 Javascript
javascript比较语义化版本号的实现代码
Sep 09 Javascript
JS基于onclick事件实现单个按钮的编辑与保存功能示例
Feb 13 Javascript
vue 监听键盘回车事件详解 @keyup.enter || @keyup.enter.native
Aug 25 Javascript
javascript实现计算指定范围内的质数示例
Dec 29 Javascript
Three.js实现3D机房效果
Dec 30 Javascript
js给table赋值的实例代码
Oct 13 #Javascript
js将table的每个td的内容自动赋值给其title属性的方法
Oct 13 #Javascript
jquery获取点击控件的绝对位置简单实例
Oct 13 #Javascript
Bootstrap幻灯片轮播图支持触屏左右手势滑动的实现方法
Oct 13 #Javascript
Node.js中常规的文件操作总结
Oct 13 #Javascript
BootStrap实现手机端轮播图左右滑动事件
Oct 13 #Javascript
js图片切换具体实现代码
Oct 13 #Javascript
You might like
我的论坛源代码(五)
2006/10/09 PHP
phpword插件导出word文件时中文乱码问题处理方案
2014/08/19 PHP
php实现的递归提成方案实例
2015/11/14 PHP
php经典算法集锦
2015/11/14 PHP
YII CLinkPager分页类扩展增加显示共多少页
2016/01/29 PHP
jQuery $.each的用法说明
2010/03/22 Javascript
JS获取DropDownList的value值与text值的示例代码
2014/01/07 Javascript
jquery 页面滚动到底部自动加载插件集合
2014/01/31 Javascript
JS实现上下左右对称的九九乘法表
2016/02/22 Javascript
jQuery实现返回顶部功能
2016/02/23 Javascript
Angularjs的Controller间通信机制实例分析
2016/11/07 Javascript
NodeJS 实现手机短信验证模块阿里大于功能
2017/06/19 NodeJs
基于JavaScript实现报警器提示音效果
2017/10/27 Javascript
深入理解JavaScript的async/await
2018/08/05 Javascript
浅谈vue加载优化策略
2019/03/19 Javascript
使用nodejs分离html文件里的js和css详解
2019/04/12 NodeJs
jquery图片预览插件实现方法详解
2019/07/18 jQuery
Python实现同时兼容老版和新版Socket协议的一个简单WebSocket服务器
2014/06/04 Python
Python中使用copy模块实现列表(list)拷贝
2015/04/14 Python
python开发之thread实现布朗运动的方法
2015/11/11 Python
Python Sql数据库增删改查操作简单封装
2016/04/18 Python
Python实现新浪博客备份的方法
2016/04/27 Python
安装python3的时候就是输入python3死活没有反应的解决方法
2018/01/24 Python
pandas的object对象转时间对象的方法
2018/04/11 Python
python 实现判断ip连通性的方法总结
2018/04/22 Python
Python实现的当前时间多加一天、一小时、一分钟操作示例
2018/05/21 Python
Python2实现的图片文本识别功能详解
2018/07/11 Python
python使用正则来处理各种匹配问题
2019/12/22 Python
Python利用 utf-8-sig 编码格式解决写入 csv 文件乱码问题
2020/02/21 Python
python可视化 matplotlib画图使用colorbar工具自定义颜色
2020/12/07 Python
马来西亚最大的电器网站:Senheng
2017/10/13 全球购物
英国简约舒适女装品牌:Great Plains
2018/07/27 全球购物
Watchshop德国:欧洲在线手表No.1
2019/06/20 全球购物
暑假实习求职信范文
2013/09/22 职场文书
中学团支部工作总结
2015/08/13 职场文书
详细介绍MySQL中limit和offset的用法
2022/05/06 MySQL