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面向对象编程浅析
Aug 28 Javascript
jquery ui对话框实例代码
May 10 Javascript
jQuery基础知识小结
Dec 22 Javascript
javascript的tab切换原理与效果实现方法
Jan 10 Javascript
JS实现快速的导航下拉菜单动画效果附源码下载
Nov 01 Javascript
JS实现简单的二元方程计算器功能示例
Jan 03 Javascript
Vue2 Vue-cli中使用Typescript的配置详解
Jul 24 Javascript
jQuery实现的文字逐行向上间歇滚动效果示例
Sep 06 jQuery
微信小程序之蓝牙的链接
Sep 26 Javascript
详解nuxt sass全局变量(公共scss解决方案)
Jun 27 Javascript
webpack 处理CSS资源的实现
Sep 27 Javascript
vue实现淘宝购物车功能
Apr 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
如何选购合适的收音机
2021/03/01 无线电
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
php $_SERVER windows系统与linux系统下的区别说明
2014/02/14 PHP
php获取从html表单传递数组的方法
2015/03/20 PHP
laravel5环境隐藏index.php后缀(apache)的方法
2019/10/12 PHP
laravel 修改记住我功能的cookie保存时间的方法
2019/10/14 PHP
Laravel 实现Controller向blade前台模板赋值的四种方式小结
2019/10/22 PHP
javascript 弹出窗口中是否显示地址栏的实现代码
2011/04/14 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
showModalDialog在谷歌浏览器下会返回Null的解决方法
2013/11/27 Javascript
js实现在同一窗口浏览图片
2014/09/17 Javascript
JavaScript与jQuery实现的闪烁输入效果
2016/02/18 Javascript
Bootstrap使用基础教程详解
2016/09/05 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
2018/05/23 Javascript
vue+mousemove实现鼠标拖动功能(拖动过快失效问题解决方法)
2018/08/24 Javascript
JS实现拼图游戏
2021/01/29 Javascript
JS获取当前时间的年月日时分秒及时间的格式化的方法
2019/12/18 Javascript
[07:27]DOTA2卡尔工作室 英雄介绍水晶室女篇
2013/06/21 DOTA
[13:18]《一刀刀一天》之DOTA全时刻21:详解TI新赛制 A队再露獠牙
2014/06/24 DOTA
[03:57]《不朽》——2015DOTA2国际邀请赛—中国军团出征主题曲MV
2015/07/15 DOTA
Python中asyncore异步模块的用法及实现httpclient的实例
2016/06/28 Python
基于python的七种经典排序算法(推荐)
2016/12/08 Python
python3 中文乱码与默认编码格式设定方法
2018/10/31 Python
python 使用shutil复制图片的例子
2019/12/13 Python
pandas实现DataFrame显示最大行列,不省略显示实例
2019/12/26 Python
如何基于Python + requests实现发送HTTP请求
2020/01/13 Python
Python通过Tesseract库实现文字识别
2020/03/05 Python
pycharm-professional-2020.1下载与激活的教程
2020/09/21 Python
爱普生美国官网:Epson美国
2018/11/05 全球购物
销售代表求职自荐信
2013/10/01 职场文书
经典洗发水广告词
2014/03/13 职场文书
经典促销广告词大全
2014/03/19 职场文书
桥梁工程专业求职信
2014/04/21 职场文书
设计顾问服务计划书
2014/05/04 职场文书
经理任命书模板
2014/06/06 职场文书
审查起诉阶段律师意见书
2015/05/19 职场文书