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 相关文章推荐
JavaScript中判断函数是new还是()调用的区别说明
Apr 07 Javascript
非常棒的10款jQuery 幻灯片插件
Jun 14 Javascript
JavaScript 对象深入学习总结(经典)
Sep 29 Javascript
javascript设置和获取cookie的方法实例详解
Jan 05 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
Oct 05 Javascript
input type=file 选择图片并且实现预览效果的实例
Oct 26 Javascript
手动用webpack搭建第一个ReactApp的示例
Apr 11 Javascript
微信小程序实现日历效果
Dec 28 Javascript
详解vue几种主动刷新的方法总结
Feb 19 Javascript
使用next.js开发网址缩短服务的方法
Jun 17 Javascript
JavaScript 与 TypeScript之间的联系
Nov 27 Javascript
交互式可视化js库gojs使用介绍及技巧
Feb 18 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
输出控制类
2006/10/09 PHP
ThinkPHP模板判断输出Empty标签用法详解
2014/06/30 PHP
PHP preg_match实现正则表达式匹配功能【输出是否匹配及匹配值】
2017/07/19 PHP
PHP7.0连接DB操作实例分析【基于mysqli】
2019/09/26 PHP
一些常用的JS功能函数代码
2009/06/23 Javascript
window.requestAnimationFrame是什么意思,怎么用
2013/01/13 Javascript
JS实现日期加减的方法
2013/11/29 Javascript
JavaScript修改css样式style动态改变元素样式
2013/12/16 Javascript
浅谈javascript中this在事件中的应用
2015/02/15 Javascript
JS判断一个数是否是水仙花数
2017/06/11 Javascript
Angularjs 1.3 中的$parse实例代码
2017/09/14 Javascript
JavaScript实现多重继承的方法分析
2018/01/09 Javascript
使用Vue开发一个实时性时间转换指令
2018/01/17 Javascript
在Vue-cli里应用Vuex的state和mutations方法
2018/09/16 Javascript
微信小程序按钮点击动画效果的实现
2019/09/04 Javascript
layui中select,radio设置不生效的解决方法
2019/09/05 Javascript
JavaScript实现图片伪异步上传过程解析
2020/04/10 Javascript
解决vue 给window添加和移除resize事件遇到的坑
2020/07/21 Javascript
[02:41]辉夜杯现场一家三口 “我爸玩风行 我玩血魔”
2015/12/27 DOTA
[59:00]DOTA2-DPC中国联赛 正赛 Ehome vs PSG.LGD BO3 第一场 3月7日
2021/03/11 DOTA
Python实现拼接多张图片的方法
2014/12/01 Python
python使用win32com库播放mp3文件的方法
2015/05/30 Python
浅谈Python 的枚举 Enum
2017/06/12 Python
python使用hdfs3模块对hdfs进行操作详解
2020/06/06 Python
Python3实现建造者模式的示例代码
2020/06/28 Python
重构Python代码的六个实例
2020/11/25 Python
用Python自动清理电脑内重复文件,只要10行代码(自动脚本)
2021/01/09 Python
世界上最大的售后摩托车零配件超市:J&P Cycles
2017/12/08 全球购物
房地产销售经理岗位职责
2014/01/01 职场文书
宣传活动总结范文
2014/07/01 职场文书
领导班子作风建设年个人整改措施
2014/09/29 职场文书
导游词之清晏园
2019/11/22 职场文书
导游词之寿县报恩寺
2020/01/19 职场文书
CSS3鼠标悬浮过渡缩放效果
2021/04/17 HTML / CSS
python批量更改目录名/文件名的方法
2021/04/18 Python
mysql通过group by分组取最大时间对应数据的两种有效方法
2022/09/23 MySQL