js分享功能实现
Posted 我要成为酷酷的人
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了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用js怎么实现网页分享功能？？？如分享到：人人，开心网，新浪微博-------我用分享到