码迷,mamicode.com
首页 > Web开发 > 详细

js分享功能实现

时间:2017-09-15 20:18:21      阅读:251      评论:0      收藏:0      [点我收藏+]

标签:paste   cti   描述   功能实现   level   rest   lib   default   20px   

分享功能初步测试,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分享功能实现

标签:paste   cti   描述   功能实现   level   rest   lib   default   20px   

原文地址:http://www.cnblogs.com/CooLLYP/p/7527719.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!