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 常用方法总结
Jun 03 Javascript
jquery操作checkbox实现全选和取消全选
May 02 Javascript
jQuery简单设置文本框回车事件的方法
Aug 01 Javascript
Javascript 实现简单计算器实例代码
Oct 23 Javascript
js导出excel文件的简洁方法(推荐)
Nov 02 Javascript
jQuery实现表格元素动态创建功能
Jan 09 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
Jun 17 Javascript
Vue2.0如何发布项目实战
Jul 27 Javascript
详解Vuex中mapState的具体用法
Sep 28 Javascript
解决vue路由后界面没有变化,但是链接有的问题
Sep 01 Javascript
javascript利用键盘控制小方块的移动
Apr 20 Javascript
ECharts transform数据转换和dataZoom在项目中使用
Dec 24 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
利用discuz实现PHP大文件上传应用实例代码
2008/11/14 PHP
Linux下手动编译安装PHP扩展的例子分享
2014/07/15 PHP
PHP技术开发微信公众平台
2015/07/22 PHP
46 个非常有用的 PHP 代码片段
2016/02/16 PHP
PHP7匿名类的用法示例
2019/04/05 PHP
JS打开图片另存为对话框实现代码
2012/12/26 Javascript
基于JQuery实现的图片自动进行缩放和裁剪处理
2014/01/31 Javascript
Js表格万条数据瞬间加载实现代码
2014/02/20 Javascript
js动态改变select选择变更option的index值示例
2014/07/10 Javascript
jQuery选择器全集详解
2014/11/24 Javascript
在Node.js应用中使用Redis的方法简介
2015/06/24 Javascript
Bootstrap3制作自己的导航栏
2016/05/12 Javascript
JS实现重新加载当前页面
2016/11/29 Javascript
在JS中a标签加入单击事件屏蔽href跳转页面
2016/12/16 Javascript
微信小程序 实战实例开发流程详细介绍
2017/01/05 Javascript
Vue-cli项目获取本地json文件数据的实例
2018/03/07 Javascript
解决vue项目使用font-awesome,build后路径的问题
2018/09/01 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
2019/07/13 Javascript
JS实现动态无缝轮播
2020/01/11 Javascript
vue中echarts的用法及与elementui-select的协同绑定操作
2020/11/17 Vue.js
Vue 实例中使用$refs的注意事项
2021/01/29 Vue.js
python实现的防DDoS脚本
2011/02/08 Python
Python自动调用IE打开某个网站的方法
2015/06/03 Python
神经网络(BP)算法Python实现及应用
2018/04/16 Python
python 内置模块详解
2019/01/01 Python
PyQt5 在label显示的图片中绘制矩形的方法
2019/06/17 Python
Europcar葡萄牙:葡萄牙汽车和货车租赁
2017/10/13 全球购物
绘儿乐产品官方在线商店:Crayola.com
2019/09/07 全球购物
如何写毕业求职自荐信
2013/11/06 职场文书
2014年新生军训方案
2014/05/01 职场文书
总经理岗位职责范本
2015/04/01 职场文书
2016高中社会实践心得体会范文
2016/01/14 职场文书
Nginx访问日志及错误日志参数说明
2021/03/31 Servers
超外差式晶体管收音机的组装与统调
2021/04/22 无线电
Python面向对象之成员相关知识总结
2021/06/24 Python
利用Redis实现点赞功能的示例代码
2022/06/28 Redis