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 相关文章推荐
10个基于浏览器的JavaScript调试工具分享
Feb 07 Javascript
ANT 压缩(去掉空格/注释)JS文件可提高js运行速度
Apr 15 Javascript
给事件响应函数传参数的四种方式小结
Dec 05 Javascript
jquery设置按钮停顿3秒不可用
Mar 07 Javascript
javascript中in运算符用法分析
Apr 28 Javascript
JS模式之单例模式基本用法
Jun 30 Javascript
慕课网题目之js实现抽奖系统功能
Sep 19 Javascript
react router 4.0以上的路由应用详解
Sep 21 Javascript
JavaScript执行环境及作用域链实例分析
Aug 01 Javascript
深入浅析Vue.js 中的 v-for 列表渲染指令
Nov 19 Javascript
Node.js控制台彩色输出的方法与原理实例详解
Dec 01 Javascript
在vue中使用echarts(折线图的demo,markline用法)
Jul 20 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使用GIFEncoder类生成的GIF动态图片验证码
2014/07/01 PHP
php判断类是否存在函数class_exists用法分析
2014/11/14 PHP
php+mysqli数据库连接的两种方式
2015/01/28 PHP
php添加数据到xml文件的简单例子
2016/09/08 PHP
PHP实现接收二进制流转换成图片的方法
2017/01/10 PHP
PHP多进程编程之僵尸进程问题的理解
2017/10/15 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
破除网页鼠标右键被禁用的绝招大全
2006/12/27 Javascript
jquery插件制作教程 txtHover
2012/08/17 Javascript
Jquery 数据选择插件Pickerbox使用介绍
2012/08/24 Javascript
jQuery基于当前元素进行下一步的遍历
2014/05/20 Javascript
jquery判断至少有一个checkbox被选中的方法
2015/06/05 Javascript
详解JavaScript语言的基本语法要求
2015/11/20 Javascript
学习JavaScript设计模式(封装)
2015/11/26 Javascript
AngularJs Modules详解及示例代码
2016/09/01 Javascript
JS中判断null的方法分析
2016/11/21 Javascript
实例详解JSON取值(key是中文或者数字)方式
2017/08/24 Javascript
vue如何解决循环引用组件报错的问题
2018/09/22 Javascript
JS数组属性去重并校验重复数据
2020/01/10 Javascript
vue@cli3项目模板怎么使用public目录下的静态文件
2020/07/07 Javascript
Javascript call及apply应用场景及实例
2020/08/26 Javascript
python使用calendar输出指定年份全年日历的方法
2015/04/04 Python
python 删除大文件中的某一行(最有效率的方法)
2017/08/19 Python
Python数据类型之List列表实例详解
2019/05/08 Python
利用anaconda作为python的依赖库管理方法
2019/08/13 Python
解决Django删除migrations文件夹中的文件后出现的异常问题
2019/08/31 Python
python将音频进行变速的操作方法
2020/04/08 Python
python跨文件使用全局变量的实现
2020/11/17 Python
德国自行车商店:Tretwerk
2019/06/21 全球购物
任命书怎么写
2014/06/04 职场文书
授权委托书格式
2014/07/31 职场文书
党员“四风”问题批评与自我批评思想汇报
2014/10/06 职场文书
小学二年级数学教学计划
2015/01/20 职场文书
中班下学期个人总结
2015/02/12 职场文书
求职信如何撰写?
2019/05/22 职场文书
Redis基于Bitmap实现用户签到功能
2021/06/20 Redis