100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > QQ 新浪微博 微信 QQ空间分享

QQ 新浪微博 微信 QQ空间分享

时间:2020-01-15 09:05:07

相关推荐

QQ 新浪微博 微信 QQ空间分享

将网站分享到第三方,如下:

1.引入jquery

2.js插件,代码如下:

(function (global, doc, factoryFn) {var factory = factoryFn(global, doc);if (!(typeof (ChePC) === 'object')) {ChePC = {};}ChePC.sharePage = ChePC.sharePage || factory;window.define && define(function (require, exports, module) {return factory;});})(this, document, function (window, document) {var sharePage = function (options) {var that = this,defaultOpts = {config: {shareUrl: window.location.href,shareTitle: document.title ? document.title : '',shareDescription: $("meta[name='description']").attr("content") ? $("meta[name='description']").attr("content") : '',shareImg: document.getElementsByTagName("img")[0] ? document.getElementsByTagName("img")[0].src : ''},wxConfig: {status: true,shareBtnName: '.shareBtn_wx'},wbConfig: {status: true,shareBtnName: '.shareBtn_wb'},qqkjConfig: {status: true,shareBtnName: '.shareBtn_qqkj'},qqConfig: {status: true,shareBtnName: '.shareBtn_qq'}};that.opts = $.extend(defaultOpts, options);that._init();that.bindFun();};sharePage.prototype = {wxSharePopMaskEl: $("#wxSharePopMask"),wxSharePopEl: $("#wxSharePop"),protocol: window.location.protocol,_init: function () {var that = this;if (that.opts.wxConfig.status) {$("body").on("click", that.opts.wxConfig.shareBtnName, function (event) {that.wxShare(event);});}if (that.opts.wbConfig.status && (!$(that.opts.wbConfig.shareBtnName).attr("href") || $(that.opts.wbConfig.shareBtnName).attr("href").indexOf("#") == 0)) {that.wbShare();}if (that.opts.qqkjConfig.status && (!$(that.opts.qqkjConfig.shareBtnName).attr("href") || $(that.opts.qqkjConfig.shareBtnName).attr("href").indexOf("#") == 0)) {that.qqkjShare();}if (that.opts.qqConfig.status && (!$(that.opts.qqConfig.shareBtnName).attr("href") || $(that.opts.qqConfig.shareBtnName).attr("href").indexOf("#") == 0)) {that.qqShare();}},wxShare: function (event) {//微信分享var that = this;that.methods.preventDefault(event);//绑定微信分享按钮点击事件if (that.wxSharePopEl.length == 0) {//添加弹窗样式that.methods.loadCssCode(that.cssCode);$("body").append(that.wxPopHtml);that.wxSharePopMaskEl = $("#wxSharePopMask");that.wxSharePopEl = $("#wxSharePop");}that.wxSharePopMaskEl.show();that.wxSharePopEl.show();},wbShare: function () {//微博分享var that = this,shareInfo = that.methods.getShareInfo(that.opts.wbConfig, that.opts)shareInfo.shareBtn.attr({"href": '///share/share.php?url=' + encodeURIComponent(shareInfo.url) + '&title=' + encodeURIComponent(shareInfo.title) + '&pic=' + encodeURIComponent(shareInfo.img) + '&appkey=2110961524&searchPic=false#_loginLayer_1487659638332',"target": "_blank"});},qqkjShare: function () {//https://sns./cgi-bin/qzshare/cgi_qzshare_onekey?url=/news/05/917771.html?pvareaid=2028130&title=【图】最高降6.5万 Jeep大切诺基售价下调_汽车之家&pics=&summary=//QQ空间分享var that = this,shareInfo = that.methods.getShareInfo(that.opts.qqkjConfig, that.opts),shareImg = shareInfo.img.indexOf("//") != 0 ? shareInfo.img : that.protocol + shareInfo.img;shareInfo.shareBtn.attr({"href": 'https://sns./cgi-bin/qzshare/cgi_qzshare_onekey?url=' + encodeURIComponent(shareInfo.url) + '&title=' + encodeURIComponent(shareInfo.title) + '&summary=' + encodeURIComponent(shareInfo.description) + '&pics=' + encodeURIComponent(shareImg),"target": "_blank"});},qqShare: function () {///widget/shareqq/index.html?url=/news/2032726.html#0-sqq-1-34980-9737f6f9e09dfaf5d3fd14d775bfee85&title=英菲尼迪斯巴达勇士赛北京站 强者齐聚_英菲尼迪_58车&desc=&summary=&site=baidu//QQ空间分享var that = this,shareInfo = that.methods.getShareInfo(that.opts.qqConfig, that.opts);shareInfo.shareBtn.attr({"href": '/widget/shareqq/index.html?url=' + encodeURIComponent(shareInfo.url) + '&title=' + encodeURIComponent(shareInfo.title) + '&desc=&summary=' + encodeURIComponent(shareInfo.description) + '&site=58che',"target": "_blank"});},bindFun: function () {var that = this;$("body").on("click", "#wxSharePopMask,#wxSharePopCloseBtn", function () {$("#wxSharePopMask,#wxSharePop").hide();})},methods: {loadCssCode: function (code) {//动态添加样式表,以<style></style>方式添加到header 样式会立即生效var style = document.createElement('style');style.type = 'text/css';style.rel = 'stylesheet';try {//for Chrome Firefox Opera Safaristyle.appendChild(document.createTextNode(code));} catch (ex) {//for IEstyle.styleSheet.cssText = code;}var head = document.getElementsByTagName('head')[0];head.appendChild(style);},preventDefault: function (event) {//屏蔽默认行为var ev = event ? event : window.event;if (ev.preventDefault) {ev.preventDefault();} else {ev.returnValue = false;}},getShareInfo: function (btnConfig, opts) {//获取分享信息var shareBtn = $(btnConfig.shareBtnName),shareTitle = shareBtn.attr("data-shareTitle") ? shareBtn.attr("data-shareTitle") : opts.config.shareTitle,shareDescription = shareBtn.attr("data-shareDescription") ? shareBtn.attr("data-shareDescription") :opts.config.shareDescription,shareUrl = shareBtn.attr("data-shareUrl") ? shareBtn.attr("data-shareUrl") : opts.config.shareUrl,shareImg = shareBtn.attr("data-shareImg") ? shareBtn.attr("data-shareImg") : opts.config.shareImg;return {shareBtn: shareBtn,title: shareTitle,description: shareDescription,url: shareUrl,img: shareImg}}},cssCode: '.wxSharePopMask{display:none;position:fixed;top:0;left:0;z-index:110000;width:100%;height:100%;background:#000;overflow:hidden;opacity:0.3;filter:Alpha(opacity=30);}.wxSharePop{display:none;position:fixed;top:50%;left:50%;margin-left:-160px;margin-top:-160px;width:310px;height:320px;overflow:hidden;padding:20px 10px;background:#fff;border:1px solid #d8d8d8;z-index:110001;font-size:12px;font-family:"simsun";}.wxSharePopTitle{font-size:14px;height:16px;line-height:16px;}.wxSharePopCloseBtn{position:absolute;top:10px;right:10px;width:16px;height:16px;color:#999;font-size:20px;cursor:pointer;}.wxSharePopImg{display:block;width:220px;height:220px;margin:15px auto;}.wxSharePopDescript{line-height:26px;color:#666;}',wxPopHtml: '<div class="wxSharePopMask" id="wxSharePopMask"></div>\<div class="wxSharePop" id="wxSharePop">\<p class="wxSharePopTitle"><B>分享到微信朋友圈</B></p>\<a class="wxSharePopCloseBtn" id="wxSharePopCloseBtn">×</a>\<img src="///qrcode/v1/qrcode/?info=' + window.location.href + '" class="wxSharePopImg">\<p class="wxSharePopDescript">\打开微信,点击底部的“发现”,<Br>\使用“扫一扫”即可将网页分享至朋友圈。\</p>\</div>'}return sharePage;});

3.用法:

这种调用方式 分享的title自动获取的是页面tittle 描述是页面的description,分享地址是当前页面url 分享的图片是当前页面第一张图

var shareFun=new ChePC.sharePage();

如需定制这些分享信息

需用以下方式调用

var shareFun=new ChePC.sharePage({config:{shareUrl:"url地址", //选填 分享地址 默认为当前页面地址shareTitle:"分享标题",//选填 分享标题 默认为当前页面titleshareDescription:"分享描述",shareImg:"分享图片地址" //选填 分享图片 默认为当前页面第一张图片}});

4.效果如下:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。