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

 更新时间:2016年10月13日 09:40:10   作者:天马3798   我要评论
这篇文章主要介绍了微信js-sdk分享功能接口常用逻辑封装,简单介绍了分享功能接口的功能、逻辑封装与使用方法,需要的朋友可以参考下

本文实例讲述了微信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中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

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

相关文章

  • 浅谈JavaScript的事件

    浅谈JavaScript的事件

    事件是可以被 JavaScript 侦测到的行为。网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。比方说,我们可以在用户点击某按钮时产生一个 onClick 事件来触发某个函数。事件在 HTML 页面中定义。
    2015-02-02
  • JS获取节点的兄弟,父级,子级元素的方法

    JS获取节点的兄弟,父级,子级元素的方法

    本篇文章主要是对JS获取节点的兄弟,父级,子级元素的方法进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • 模拟抽奖

    模拟抽奖

    模拟抽奖...
    2006-08-08
  • ES6实现的遍历目录函数示例

    ES6实现的遍历目录函数示例

    这篇文章主要介绍了ES6实现的遍历目录函数,涉及ES6文件目录的遍历、读取、回调函数及json相关操作技巧,需要的朋友可以参考下
    2017-04-04
  • echart简介_动力节点Java学院整理

    echart简介_动力节点Java学院整理

    这篇文章主要介绍了echart简介,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • 使用js操作cookie的一点小收获分享

    使用js操作cookie的一点小收获分享

    js操作cookie想必大家并不陌生吧,本文积累了一点小经验,在此与大家分享下,希望对大家有所帮助
    2013-09-09
  • js实现返回顶部效果

    js实现返回顶部效果

    本文主要介绍了js实现返回顶部效果的实例。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • 如何实现一个webpack模块解析器

    如何实现一个webpack模块解析器

    这篇文章主要介绍了如何实现一个webpack模块解析器,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-10-10
  • Javascript格式化并高亮xml字符串的方法及注意事项

    Javascript格式化并高亮xml字符串的方法及注意事项

    这篇文章主要介绍了Javascript格式化并高亮xml字符串的方法及注意事项,需要的朋友可以参考下
    2018-08-08
  • echarts整合多个类似option的方法实例

    echarts整合多个类似option的方法实例

    这篇文章主要给大家介绍了关于echarts整合多个类似option的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-07-07

最新评论