js实现通用的微信分享组件示例

 更新时间:2014年03月10日 15:34:58   作者:  
这篇文章主要介绍了微信分享通用组件,用于微信浏览器内浏览网页的分享信息定义,需要的朋友可以参考下

一、可定义的信息

1、分享时显示的LOGO;
2、分享LOGO的宽度;
3、分享LOGO的高度;
4、分享出去显示的标题(默认调用网页标题);
5、分享出去显示的描述(默认调用网页标题);
6、分享链接(默认为当前页面的URL)。
7、分享微信的APPID(一般为空)。

二、使用方法

1、引入微信分享组件js:

复制代码 代码如下:

/*******************************
 * Author:Mr.Think
 * Description:微信分享通用代码
 * 使用方法:_WXShare('分享显示的LOGO','LOGO宽度','LOGO高度','分享标题','分享描述','分享链接','微信APPID(一般不用填)');
 *******************************/
function _WXShare(img,width,height,title,desc,url,appid){
    //初始化参数
    img=img||'http://a.zhixun.in/plug/img/ico-share.png';
    width=width||100;
    height=height||100;
    title=title||document.title;
    desc=desc||document.title;
    url=url||document.location.href;
    appid=appid||'';
    //微信内置方法
    function _ShareFriend() {
        WeixinJSBridge.invoke('sendAppMessage',{
              'appid': appid,
              'img_url': img,
              'img_width': width,
              'img_height': height,
              'link': url,
              'desc': desc,
              'title': title
              }, function(res){
                _report('send_msg', res.err_msg);
          })
    }
    function _ShareTL() {
        WeixinJSBridge.invoke('shareTimeline',{
              'img_url': img,
              'img_width': width,
              'img_height': height,
              'link': url,
              'desc': desc,
              'title': title
              }, function(res) {
              _report('timeline', res.err_msg);
              });
    }
    function _ShareWB() {
        WeixinJSBridge.invoke('shareWeibo',{
              'content': desc,
              'url': url,
              }, function(res) {
              _report('weibo', res.err_msg);
              });
    }
    // 当微信内置浏览器初始化后会触发WeixinJSBridgeReady事件。
    document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
            // 发送给好友
            WeixinJSBridge.on('menu:share:appmessage', function(argv){
                _ShareFriend();
          });

            // 分享到朋友圈
            WeixinJSBridge.on('menu:share:timeline', function(argv){
                _ShareTL();
                });

            // 分享到微博
            WeixinJSBridge.on('menu:share:weibo', function(argv){
                _ShareWB();
           });
    }, false);
}

相关文章

  • javascript类型系统——undefined和null全面了解

    javascript类型系统——undefined和null全面了解

    下面小编就为大家带来一篇javascript类型系统——undefined和null全面了解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • JavaScript数据结构和算法之二叉树详解

    JavaScript数据结构和算法之二叉树详解

    这篇文章主要介绍了JavaScript数据结构和算法之二叉树详解,本文讲解了二叉树的概念、二叉树的特点、二叉树节点的定义、查找最大和最小值等内容,需要的朋友可以参考下
    2015-02-02
  • 微信小程序开发之入门实例教程篇

    微信小程序开发之入门实例教程篇

    2016年推出微信小程序,时至今日,历经几个版本的更新,已形成了相对实用和稳定的服务平台。本文简单的介绍了微信小程序的入门用法,今后会继续关注和实践。需要的朋友可以参考学习,下面来一起看看吧。
    2017-03-03
  • javascript事件模型介绍

    javascript事件模型介绍

    在各种浏览器中存在三种事件模型:原始事件模型( original event model),DOM2事件模型,IE事件模型.其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE以外的所有主流浏览器支持。
    2016-05-05
  • JavaScript DOM基础

    JavaScript DOM基础

    这篇文章主要介绍了JavaScript的DOM基础知识,需要的朋友可以参考下
    2015-04-04
  • JavaScript中setUTCFullYear()方法的使用简介

    JavaScript中setUTCFullYear()方法的使用简介

    这篇文章主要介绍了JavaScript中setUTCFullYear()方法的使用简介,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06
  • JavaScript中Boolean对象的属性解析

    JavaScript中Boolean对象的属性解析

    这篇文章主要介绍了JavaScript中布尔对象的属性解析,包括对constructor属性和prototype构造器的简单介绍,需要的朋友可以参考下
    2015-10-10
  • NodeJS url验证(url-valid)的使用方法

    NodeJS url验证(url-valid)的使用方法

    本文主要介绍了NodeJS url验证(url-valid)模块的使用方法,最后提供了实例代码供大家参考
    2013-11-11
  • js代码实现随机颜色的小方块

    js代码实现随机颜色的小方块

    这篇文章主要用js代码实现颜色随机的小方块,需要的朋友可以参考下
    2015-07-07
  • javascript学习笔记(九) js对象 设计模式

    javascript学习笔记(九) js对象 设计模式

    javascript学习笔记之js对象 设计模式介绍,需要的朋友可以参考下
    2012-06-06

最新评论