H5⼿机移动端调起浏览器（qq浏览器，uc浏览器）⾃带分享功
能实例
H5⼿机移动端调起浏览器（qq浏览器，uc浏览器）⾃带分享功能实例
html：
<span class="viewshare wx"  data-mshare="2"></span>
<span class="viewshare wxline"  data-mshare="1"></span>
<span class="viewshare QQ"  data-mshare="3"></span>
<span class="viewshare wb" data-mshare="4"></span>
js：
// 引⼊JS⽂件
<script src="js/mshare.js"></script>
var u = navigator.appVersion;
var uc = u.split('UCBrowser/').length > 1  ? 1 : 0;
var qq = u.split('MQQBrowser/').length > 1 ? 2 : 0;
var wx = ((u.match(/MicroMessenger/i)) && (u.match(/MicroMessenger/i).toString().toLowerCase() == 'micromessenger'));
// 绑定单击事件
$('.wx,.wxline,.QQ,.wb').on("click", function () {
if(uc||(qq && !wx)){
mshare.init(+$(this).data('mshare'));
}
}
mshare.js
/**
* mshare.js
* 此插件主要作⽤是在UC和QQ两个主流浏览器
* 上⾯触发分享到朋友圈或发送给朋友的功能
* 代码编写过程中参考:
* mjs.sinaimg/wap/module/share/201501261608/js/addShare.js
* 此外，JefferyWang的项⽬对我也有⼀定启⽰：
* github/JefferyWang/nativeShare.js
*
*/
!(function(global) {
'use strict';
var UA, uc, qq, wx, tc, qqVs, ucVs, os,qqBridgeDone;
UA = navigator.appVersion;
// 是否是 UC 浏览器
uc = UA.split('UCBrowser/').length > 1  ? 1 : 0;
// 判断 qq 浏览器
// 然⽽qq浏览器分⾼低版本  2代表⾼版本  1代表低版本
qq = UA.split('MQQBrowser/').length > 1 ? 2 : 0;
// 是否是
wx = ((UA.match(/MicroMessenger/i)) && (UA.match(/MicroMessenger/i).toString().toLowerCase() == 'micromessenger'));
// 浏览器版本
qqVs = qq ? parseFloat(UA.split('MQQBrowser/')[1]) : 0;
ucVs = uc ?  parseFloat(UA.split('UCBrowser/')[1]) : 0;
//获取操作系统信息  iPhone(1)  Android(2)
os = (function () {
var ua = navigator.userAgent;
if (/iphone|st(ua)) {
return1;
} else if(/st(ua)){
return2;
} else {
return0;
}
}());
// qq浏览器下⾯是否加载好了相应的api⽂件
qqBridgeDone = false;
// 进⼀步细化版本和平台判断
// 参考: github/JefferyWang/nativeShare.js
//mjs.sinaimg/wap/module/share/201501261608/js/addShare.js
if ((qq && qqVs < 5.4 && os == 1) || (qq && qqVs < 5.3 && os == 1)) {
qq = 0;
} else {
if (qq && qqVs < 5.4 && os == 2) {
qq = 1;
} else {
if (uc && ( (ucVs < 10.2 && os == 1) || (ucVs < 9.7 && os == 2) )) {
uc = 0;
}
}
}
/**
* qq浏览器下⾯根据不同版本加载对应的bridge
* @method loadqqApi
* @param  {Function} cb 回调函数
*/
function loadqqApi(cb) {
if (!qq) { // qq == 0
return cb && cb();
}
var qqApiScript = ateElement('script');
//需要等加载过qq的接⼝⽂档之后，再去初始化分享组件
// qq == 1 低版本
// qq == 2 ⾼版本
qqApiScript.src = (qq == 1 ) ? '3gimg.qq/html5/js/qb.js' : 'jsapi.qq/get?api=app.share';        document.body.appendChild(qqApiScript);
}
/**
* UC浏览器分享
* @method ucShare
*/
function ucShare(config) {
// ['title', 'content', 'url', 'platform', 'disablePlatform', 'source', 'htmlID']
// 关于platform
// ios: kWeixin || kWeixinFriend;
// android: WechatFriends || WechatTimeline
// uc 分享会直接使⽤截图
var platform = '', shareInfo;
// 指定了分享类型
if (pe) {
if (os == 2) {
pe==1){
platform = 'WechatTimeline';
}else pe==2){
platform = 'WechatFriends';
}else pe==3){
platform = 'QQ';
}else pe==4){
platform = 'SinaWeibo';
}else pe==0){
platform = 'undefined';
}
} else if (os == 1) {
pe==1){
platform = 'kWeixinFriend';
}else pe==2){
platform = 'kWeixin';
}else pe==3){
platform = 'kQQ';
}else pe==4){
platform = 'kSinaWeibo';
}else pe==0){
platform = 'undefined';
}
}
}
shareInfo = [ config.title, config.desc, config.url, platform, '', '', '' ];
// android
if (window.ucweb) {
ucweb.startRequest && ucweb.startRequest('shell.page_share', shareInfo);
}
else if (window.ucbrowser) {
ucbrowser.web_share && ucbrowser.web_share.apply(null, shareInfo);
}
};
/**
* qq浏览器分享函数
* @method qqShare
*/
function qqShare(config) {
var type = '';
//好友1, 朋友圈8,QQ 4
pe==1){
type = 8;
}else pe==2){
type = 1;
}else pe==3){
html手机网站
type = 4;
}else pe==4){
type = 11;
}else pe==0){
type = 'undefined';
}
var share = function () {
var shareInfo = {
'url': config.url,
'title': config.title,
'description': config.desc,
'img_url': config.img,
'img_title': config.title,
'to_app': type,
'cus_txt': ''
};
if (window.browser) {
browser.app && browser.app.share(shareInfo);
} else if (window.qb) {
qb.share && qb.share(shareInfo);
}
};
if (qqBridgeDone) {
share();
} else {
loadqqApi(share);
}
};
/**
* 对外暴露的接⼝函数
* @method mShare
* @param  {Object} config 配置对象参数见⽰例
*    var config = {
*          title : 'Lorem ipsum dolor sit.'
*        , url  : 'm.ly'
*        , desc  : 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat inventore minima voluptates.'    *        , img  : 'img1.40017/cn/s/c/2015/loading.gif'
*        , type  : type // 1 ==> 朋友圈  2 ==> 朋友  0 ==> 直接弹出原⽣ 3==>QQ
*    }
*/
function mShare(config) {
this.check = function (succssFn, wxFn, failFn) {
if (uc) {
succssFn();
} else if (qq && !wx) {
succssFn();
} else if (wx) {
wxFn();
} else {
failFn();
}
}
this.init = function (type) {
if (typeof type != 'undefined') pe = type;
try {
if (uc) {
fig);
} else if (qq && !wx) {
fig);
} catch (e) {}
}
}
// 预加载 qq bridge
loadqqApi(function () {
qqBridgeDone = true;    });
// ⽅法暴露给全局变量global.mShare = mShare; })(this);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。