js 实现分享功能
分享功能初步测试，title为当前页面的title。 其他详见注释！！！
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8;">
<title>分享代码测试</title>
<meta name="author" content="rainna" />
<meta name="keywords" content="rainna's js lib" />
<meta name="description" content="js" />
<style>
*{margin:0;padding:0;}
img{border:0 none;}
body{background:#eee;}
.m-box{width:800px;margin:0 auto;padding:20px;background:#fff;}
.m-box p{margin:0 0 10px;}
.m-box .icn a{display:block;width:55px;height:35px;background:url('http://l.bst.126.net/rsc/img/weibo.png?035') no-repeat;}
.m-box .icn .wb1{background-position:10px -216px;}
.m-box .icn .wb2{background-position:-190px -216px;}
.m-box .icn .wb3{background:url(http://l.bst.126.net/rsc/img/postshare/tieba24.png) 15px 0 no-repeat;}
.m-box .icn .wb4{background-position:-88px -215px;}
.m-box .icn .wb5{background-position:-138px -216px;}
.m-box .icn .wb6{background-position:-245px -216px;}
.m-box .icn .wb7{background-position:-300px -216px;}
.m-box .icn .wb8{background-position:-355px -216px;}
.m-box .icn .wb9{background-position:-415px -215px;}
</style>
</head>
<body>
<div class="m-box">
<p>分享到微信,易信:</p>
<div class="icn"><img width="200" src="https://qr.api.cli.im/qr?data=http%253A%252F%252Fwww.cnblogs.com%252FCooLLYP%252F&level=H&transparent=false&bgcolor=%23ffffff&forecolor=%23000000&blockpixel=12&marginblock=1&logourl=&size=280&kid=cliim&key=6b3febe84f9780fb193f9d8f9d189e4f" /></div>
</div>
<div class="m-box">
<p>分享到新浪微博:<a href="http://open.weibo.com/wiki/ShareCode" target="_blank">http://open.weibo.com/wiki/ShareCode</a></p>
<div class="icn"><a href="#" class="wb1" onclick="shareToSinaWB(event)"></a></div>
</div>
<div class="m-box">
<p>分享到QQ空间:<a href="http://connect.qq.com/intro/share/" target="_blank">http://connect.qq.com/intro/share/</a></p>
<div class="icn"><a href="#" class="wb2" onclick="shareToQzone(event)"></a></div>
</div>
<div class="m-box">
<p>分享到百度贴吧:<a href="http://share.baidu.com/code/advance" target="_blank">http://share.baidu.com/code/advance</a></p>
<div class="icn"><a href="#" class="wb3" onclick="shareToTieba(event)"></a></div>
</div>
<div class="m-box">
<p>分享到豆瓣:</p>
<div class="icn"><a href="#" class="wb4" onclick="shareToDouban(event)"></a></div>
</div>
<div class="m-box">
<p>分享到腾迅微博:<a href="http://dev.t.qq.com/websites/share/" target="_blank">http://dev.t.qq.com/websites/share/</a></p>
<div class="icn"><a href="#" class="wb5" onclick="shareToQQwb(event)"></a></div>
</div>
<div class="m-box">
<p>分享到开心网:<a href="http://open.kaixin001.com/document.php?type=records#code" target="_blank">http://open.kaixin001.com/document.php?type=records#code</a></p>
<div class="icn"><a href="#" class="wb7" onclick="shareToKaixin(event)"></a></div>
</div>
<div class="m-box">
<p>分享到facebook:</p>
<div class="icn"><a href="#" class="wb8" onclick="shareToFacebook(event)"></a></div>
</div>
<div class="m-box">
<p>分享到Twitter:</p>
<div class="icn"><a href="#" class="wb9" onclick="shareToTwitter(event)"></a></div>
</div>
<script>
var _title,_source,_sourceUrl,_pic,_showcount,_desc,_summary,_site,
_width = 600,
_height = 600,
_top = (screen.height-_height)/2,
_left = (screen.width-_width)/2,
_url = 'http://www.cnblogs.com/CooLLYP/',
_pic = 'https://pic.cnblogs.com/avatar/1035330/20160929170744.png';
//分享到新浪微博
function shareToSinaWB(event){
event.preventDefault();
var _shareUrl = 'http://v.t.sina.com.cn/share/share.php?&appkey=895033136'; //真实的appkey，必选参数
_shareUrl += '&url='+ encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location，可选参数
_shareUrl += '&title=' + encodeURIComponent(_title||document.title); //参数title设置分享的标题|默认当前页标题，可选参数
_shareUrl += '&source=' + encodeURIComponent(_source||'');
_shareUrl += '&sourceUrl=' + encodeURIComponent(_sourceUrl||'');
_shareUrl += '&content=' + 'utf-8'; //参数content设置页面编码gb2312|utf-8，可选参数
_shareUrl += '&pic=' + encodeURIComponent(_pic||''); //参数pic设置图片链接|默认为空，可选参数
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',top='+_top+',left='+_left+',toolbar=no,menubar=no,scrollbars=no, resizable=1,location=no,status=0');
}
//分享到QQ空间
function shareToQzone(event){
event.preventDefault();
var _shareUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?';
_shareUrl += 'url=' + encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location
_shareUrl += '&showcount=' + _showcount||0; //参数showcount是否显示分享总数,显示：'1'，不显示：'0'，默认不显示
_shareUrl += '&desc=' + encodeURIComponent(_desc||'分享的描述'); //参数desc设置分享的描述，可选参数
_shareUrl += '&summary=' + encodeURIComponent(_summary||'分享摘要'); //参数summary设置分享摘要，可选参数
_shareUrl += '&title=' + encodeURIComponent(_title||document.title); //参数title设置分享标题，可选参数
_shareUrl += '&site=' + encodeURIComponent(_site||''); //参数site设置分享来源，可选参数
_shareUrl += '&pics=' + encodeURIComponent(_pic||''); //参数pics设置分享图片的路径，多张图片以＂|＂隔开，可选参数
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',top='+_top+',left='+_left+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到百度贴吧
function shareToTieba(event){
event.preventDefault();
var _shareUrl = 'http://tieba.baidu.com/f/commit/share/openShareApi?';
_shareUrl += 'title=' + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += '&url=' + encodeURIComponent(_url||document.location); //分享的链接
_shareUrl += '&pic=' + encodeURIComponent(_pic||''); //分享的图片
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到豆瓣
function shareToDouban(event){
event.preventDefault();
var _shareUrl = 'http://shuo.douban.com/!service/share?';
_shareUrl += 'href=' + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += '&name=' + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += '&image=' + encodeURIComponent(_pic||''); //分享的图片
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到腾迅微博
function shareToQQwb(event){
event.preventDefault();
var _shareUrl = 'http://v.t.qq.com/share/share.php?';
_shareUrl += 'title=' + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += '&url=' + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += '&appkey=5bd32d6f1dff4725ba40338b233ff155'; //在腾迅微博平台创建应用获取微博AppKey
_shareUrl += '&site=' + encodeURIComponent(_site||''); //分享来源
_shareUrl += '&pic=' + encodeURIComponent(_pic||''); //分享的图片，如果是多张图片，则定义var _pic='图片url1|图片url2|图片url3....'
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到开心网
function shareToKaixin(event){
event.preventDefault();
var _shareUrl = 'http://www.kaixin001.com/rest/records.php?';
_shareUrl += 'url=' + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += '&content=' + encodeURIComponent('分享的文字'); //需要分享的文字，当文字为空时，自动抓取分享网址的title
_shareUrl += '&pic=' + encodeURIComponent(_pic||''); //分享的图片,多个使用半角逗号分隔
_shareUrl += '&showcount=0'; //是否显示分享数，显示：'1'，不显示：'0'
_shareUrl += '&style=11'; //显示的样式，必选参数
_shareUrl += '&aid=' + encodeURIComponent(_site||''); //显示分享来源
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
function shareToKaixin2(event){
event.preventDefault();
var _shareUrl = 'http://www.kaixin001.com/repaste/share.php?';
_shareUrl += 'rtitle=' + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到facebook
function shareToFacebook(event){
event.preventDefault();
var _shareUrl = 'http://www.facebook.com/sharer/sharer.php?';
_shareUrl += 'u=' + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += '&t=' + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//分享到Twitter
function shareToTwitter(event){
event.preventDefault();
var _shareUrl = 'http://twitter.com/intent/tweet?';
_shareUrl += 'url=' + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += '&text=' + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',left='+_left+',top='+_top+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
</script>
</body>
</html>
js 实现分享功能的更多相关文章
- js前端分享功能
直接添加网页分享代码就可以了.实现方法如下:1.打开百度分享:http://share.baidu.com.2.点击“代码获取”.3.进行个性化设置.
- 微信JS分享功能--微信JS系列文章（二）
概述 在上一篇文章微信JS初始化-- 微信JS系列文章(一)中已经介绍了微信JS初始化的相关工作,接下来本文继续就微信JS的分享功能进行描述,供大家参考. 代码 $(document).ready(f ...
- js分享功能
引用JiaThis的分享功能: 直接在想要放置分享功能的地方加上如下代码即可: <!-- JiaThis Button BEGIN --> <div class="jiat ...
- js分享功能(微信,QQ,微博,空间,豆瓣等)
日常编程中,我们可能会碰到项目中的分享功能,各大平台都有分享接口和文档说明,当然也有一些一键分享插件,例如:sosh,iShare.js等等 但有些同学不想引用插件,那么我整理了一些常用的分享至平台功 ...
- php框架tp3.2.3和js写的微信分享功能心得，分享的标题内容图片自定义
https://blog.csdn.net/weixin_42231483/article/details/81585322 最近用PHP的tp3.2.3框架和js写的微信分享功能心得,分享的标题内容 ...
- 页面分享功能，分享好友、朋友圈判断，用share_type做标记 这里用的是jweixin-1.3.2.js
这里用的是jweixin-1.3.2.js trigger: function (res) { //判断分享的状态,好友.朋友圈 localStorage.setItem("share_ty ...
- js 微信分享
一. //js接口 var shareme; var urls = window.location.href; if(isWeiXin()){ var weifileref=document.cr ...
- 微信JS-SDK实际分享功能
为了净化网络,整顿诱导分享及诱导关注行为,微信于2014年12月30日发布了<微信公众平台关于整顿诱导分享及诱导关注行为的公告>,微信平台开发者发现,原有的微信分享功能不能用了,在ipho ...
- js快速分享代码
这是一款简单易用的文章分享工具,您只需将下面的html代码拷贝到模板中就可以实现文章快速分享功能.如果您想分享你的博客.个人网站或者企业网站等等,下面是两款不错的分享工具,值得拥有! 1. <d ...
随机推荐
- CORS跨域请求C#版
1.什么是跨域请求: 当从A网站使用AJAX请求B网站时,就会出现跨域请求. 此时B网站能够接收到A网站发来的请求并返回相应的结果,但是浏览器拿到B网站返回的数据时检测到与当前网站的域名不同,出于安 ...
- html/JS onload的详解
等待页面都加载完后再执行 <!DOCTYPE html><html lang="en"><head> <meta charset=&quo ...
- SpringMVC 工作流程
版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/baidu_36697353/article/details/64444147 SpringMVC 工 ...
- mysql存储过程优化
示例 WHILE s <> 1 DO select xxx; insert into xxx; END WHILE; 执行耗时27秒 优化点1: 添加事物 START TRANSACTIO ...
- DIV固定宽度和动态拉伸混合水平排列
1.效果图 2.源代码 html <h2>1.头部固定,尾部拉伸</h2> <div class="container" id="div1& ...
- CF Dima and To-do List
B. Dima and To-do List time limit per test 1 second memory limit per test 256 megabytes input standa ...
- spring 代理
java动态代理实现 1. Java自带的动态代理,反射生成字节码 2. Cglib调用asm生成子类 spring 中代理实现 1. 如果类实现了接口,使用java动态代理 2. 没有实现接口,使用 ...
- mac 安装mysql-python
ln -s /usr/local/mysl/bin/* /usr/bin #建立软连接 sudo pip install mysql-python #安装 python ...
- 11.7NOIP模拟赛解题报告
心路历程 预计得分:\(50 + 100 + 100\) 实际得分:\(50 + 100 +100\) T2 T3两道数据结构题美滋滋,然而写完就过去\(3h\)美滋滋 T1数学题学弟们都会做Orzz ...
- cf1043E. Mysterious Crime(二分 前缀和)
题意 题目链接 Sol 考场上做完前四题的时候大概还剩半个小时吧,那时候已经困的不行了. 看了看E发现好像很可做?? 又仔细看了几眼发现这不是sb题么... 先考虑两个人,假设贡献分别为\((x, y ...