js实现将选中内容分享到新浪或腾讯微博


Posted in Javascript onDecember 16, 2015

微博如火如荼,大家都选择用微博带来社会化流量,顺便推广产品和网站,几乎所有的网站都有分享到代码,但是还有一种更快捷的分享方式,javascript就可以实现将选定内容轻松分享到新浪微博和腾讯微博,效果图如下:

js实现将选中内容分享到新浪或腾讯微博

将选中的内容分享到新浪微博,腾讯微博实现js代码如下:

<STYLE>
.img_sina_share {
DISPLAY: none; CURSOR: pointer; POSITION: absolute
}
.img_qq_share {
DISPLAY: none; CURSOR: pointer; POSITION: absolute
}
</STYLE>
<IMG
class=img_sina_share id=imgSinaShare title=将选中内容分享到新浪微博
src="http://www.phpddt.com/usr/themes/dddefault/images/sina.gif">
<IMG
class=img_qq_share id=imgQqShare title=将选中内容分享到腾讯微博
src="http://www.phpddt.com/usr/themes/dddefault/images/qq.gif">
<SCRIPT>
var eleImgShare = document.getElementById("imgSinaShare"); /
var eleImgShare2 = document.getElementById("imgQqShare"); 
 
var $miniBlogShare = function(eleShare,eleShare2,eleContainer) { //实现方法
var eleTitle = document.getElementsByTagName("title")[0];
eleContainer = eleContainer || document;
var funGetSelectTxt = function() { //获取选中文字
var txt = "";
if(document.selection) {
txt = document.selection.createRange().text; // IE
} else {
txt = document.getSelection();
}
return txt.toString();
};
eleContainer.onmouseup = function(e) { //限定容器若有文字被选中
e = e || window.event;
var txt = funGetSelectTxt(), sh = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
var left = (e.clientX - 40 < 0) ? e.clientX + 20 : e.clientX - 40, top = (e.clientY - 40 < 0) ? e.clientY + sh + 20 : e.clientY + sh - 40;
if (txt) {
eleShare.style.display = "inline";
eleShare.style.left = left + "px";
eleShare.style.top = top + "px";
eleShare2.style.display = "inline";
eleShare2.style.left = left + 30 + "px";
eleShare2.style.top = top + "px";
} else {
eleShare.style.display = "none";
eleShare2.style.display = "none";
}
};
eleShare.onclick = function() { //点击新浪微博图标
var txt = funGetSelectTxt(), title = (eleTitle && eleTitle.innerHTML)? eleTitle.innerHTML : "未命名页面";
if (txt) {
window.open('http://v.t.sina.com.cn/share/share.php?title=' + txt + ' ' + title + '&url=' + window.location.href + '','微博分享','width=700, height=580, top=320, left=180, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no');
}
};
eleShare2.onclick = function() { //点击腾讯微博图标
var txt = funGetSelectTxt(), title = (eleTitle && eleTitle.innerHTML)? eleTitle.innerHTML : "未命名页面";
if (txt) {
window.open( 'http://v.t.qq.com/share/share.php?title=' + encodeURIComponent(txt + ' ' + title + ' ') + '&url=' + window.location.href + '','微博分享','width=700, height=580, top=320, left=180, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no');
}
};
}(eleImgShare,eleImgShare2);
</SCRIPT>

将以上的代码黏贴到你想要进行内容分享的页面,要注意的是,最好不要放在header.php或者footer.php这样网站所有内容都进行分享,而我只是放在文章页面!

以上就是js实现将选中内容分享到新浪或腾讯微博的详细代码,希望对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
js Date自定义函数 延迟脚本执行
Mar 10 Javascript
小议Javascript中的this指针
Mar 18 Javascript
Js event事件在IE、FF兼容性问题
Jan 01 Javascript
基于Javascript实现返回顶部按钮
Feb 29 Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
May 25 Javascript
如何提高Dom访问速度
Jan 05 Javascript
浅谈JS验证表单文本域输入空格的问题
Feb 14 Javascript
jquery实现图片放大点击切换
Jun 06 jQuery
详解vue渲染从后台获取的json数据
Jul 06 Javascript
JavaScript中发出HTTP请求最常用的方法
Jul 12 Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
Sep 01 Javascript
js实现AI五子棋人机大战
May 28 Javascript
JavaScript运行过程中的“预编译阶段”和“执行阶段”
Dec 16 #Javascript
Sublime Text 3常用插件及安装方法
Dec 16 #Javascript
基于MVC4+EasyUI的Web开发框架形成之旅之界面控件的使用
Dec 16 #Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 #Javascript
javascript基于prototype实现类似OOP继承的方法
Dec 16 #Javascript
javascript数组克隆简单实现方法
Dec 16 #Javascript
Perl Substr()函数及函数的应用
Dec 16 #Javascript
You might like
PHP动态图像的创建
2006/10/09 PHP
PHP无限分类(树形类)的深入分析
2013/06/02 PHP
PHP实现微信网页授权开发教程
2016/01/19 PHP
php遍历目录下文件并按修改时间排序操作示例
2019/07/12 PHP
javascript 计算两个整数的百分比值
2009/12/26 Javascript
Js 刷新框架页的代码
2010/04/13 Javascript
得到jQuery detach()后节点中的某个值实现代码
2013/02/05 Javascript
Table冻结表头示例代码
2013/08/20 Javascript
JavaScript中输出标签的方法
2014/08/27 Javascript
jQuery弹簧插件编写基础之“又见弹窗”
2015/12/11 Javascript
JavaScript获取图片像素颜色并转换为box-shadow显示
2016/03/11 Javascript
针对JavaScript中this指向的简单理解
2016/08/26 Javascript
Jquery Easyui进度条组件Progress使用详解(8)
2020/03/26 Javascript
ES6概念 ymbol.for()方法
2016/12/25 Javascript
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
2017/06/02 jQuery
详解Node全局变量global模块
2017/09/28 Javascript
js判断文件类型大小并给出提示的实现方法
2018/01/03 Javascript
AngularJS标签页tab选项卡切换功能经典实例详解
2018/05/16 Javascript
element中Steps步骤条和Tabs标签页关联的解决
2020/12/08 Javascript
Vue如何跨组件传递Slot的实现
2020/12/14 Vue.js
浅谈Python类的__getitem__和__setitem__特殊方法
2016/12/25 Python
python基础教程之五种数据类型详解
2017/01/12 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
python 实现汉诺塔游戏
2020/11/28 Python
Draper James官网:知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
Bravofly德国:预订廉价航班和酒店
2019/09/22 全球购物
Linux内核的同步机制是什么?主要有哪几种内核锁
2016/07/11 面试题
幼儿园母亲节活动方案
2014/03/10 职场文书
环保建议书作文
2014/03/12 职场文书
八项规定对照检查材料
2014/08/31 职场文书
2015年销售工作总结范文
2015/03/30 职场文书
罚款通知怎么写
2015/04/22 职场文书
光荣之路观后感
2015/06/12 职场文书
python 爬取吉首大学网站成绩单
2021/06/02 Python
MySQL快速插入一亿测试数据
2021/06/23 MySQL
漫画「处刑少女的生存之道」第3卷封面公开
2022/03/21 日漫