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 oop开发滑动(slide)菜单控件
Aug 25 Javascript
js多级树形弹出一个小窗口层(非常好用)实例代码
Mar 19 Javascript
使用jquery实现以post打开新窗口
Mar 19 Javascript
javascript白色简洁计算器
May 04 Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
May 16 Javascript
Javascript中replace()小结
Sep 30 Javascript
js微信分享API
Oct 11 Javascript
微信小程序-横向滑动scroll-view隐藏滚动条
Apr 20 Javascript
详解利用jsx写vue组件的方法示例
Jul 17 Javascript
解决在Bootstrap模糊框中使用WebUploader的问题
Mar 22 Javascript
详解无限滚动插件vue-infinite-scroll源码解析
May 12 Javascript
开发一个封装iframe的vue组件
Mar 29 Vue.js
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 has encountered an Access Violation 错误的解决方法
2010/01/17 PHP
linux下为php添加curl扩展的方法
2011/07/29 PHP
深入PHP与浏览器缓存的分析
2013/06/03 PHP
PHP 导出Excel示例分享
2014/08/18 PHP
php远程下载类分享
2016/04/13 PHP
PHP从尾到头打印链表实例讲解
2018/09/27 PHP
JavaScript脚本性能优化注意事项
2008/11/18 Javascript
Javascript 函数对象的多重身份
2009/06/28 Javascript
利用JavaScript实现新闻滚动效果(实例代码)
2013/11/27 Javascript
extjs_02_grid显示本地数据、显示跨域数据
2014/06/23 Javascript
jQuery实现简单的图片查看器
2020/09/11 Javascript
去除字符串左右两边的空格(实现代码)
2016/05/12 Javascript
如何解决vue与传统jquery插件冲突
2017/03/20 Javascript
浅谈vue中改elementUI默认样式引发的static与assets的区别
2018/02/03 Javascript
详解Axios 如何取消已发送的请求
2018/10/20 Javascript
使用coverage统计python web项目代码覆盖率的方法详解
2019/08/05 Python
python面向对象之类属性和类方法案例分析
2019/12/30 Python
Python 3.10 的首个 PEP 诞生,内置类型 zip() 迎来新特性(推荐)
2020/07/03 Python
微软开源最强Python自动化神器Playwright(不用写一行代码)
2021/01/05 Python
canvas绘制文本内容自动换行的实现代码
2019/01/14 HTML / CSS
HTML5 embed 标签使用方法介绍
2013/08/13 HTML / CSS
西海岸男士和男童服装:Johnnie-O
2018/03/15 全球购物
俄罗斯三星品牌商店:GalaxyStore
2020/11/04 全球购物
介绍一下linux文件系统分配策略
2012/11/17 面试题
学校门卫工作职责
2013/12/07 职场文书
医学专业毕业生个人求职信
2013/12/25 职场文书
《会走路的树》教后反思
2014/04/19 职场文书
商务经理岗位职责
2014/07/30 职场文书
2014年社区个人工作总结
2014/12/02 职场文书
大学生社会实践活动总结报告
2015/05/06 职场文书
小学少先队活动总结
2015/05/08 职场文书
初中生物教学随笔
2015/08/15 职场文书
详解Mysql 函数调用优化
2021/04/07 MySQL
解决Navicat for MySQL 连接 MySQL 报2005错误的问题
2021/05/29 MySQL
使用Spring处理x-www-form-urlencoded方式
2021/11/02 Java/Android
7个关于Python的经典基础案例
2021/11/07 Python