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 相关文章推荐
jquery 图片预加载 自动等比例缩放插件
Dec 25 Javascript
JavaScript replace(rgExp,fn)正则替换的用法
Mar 04 Javascript
node.js中的socket.io的广播消息
Dec 15 Javascript
JQuery EasyUI的使用
Feb 24 Javascript
Mac下使用charles遇到的问题以及解决办法
Jan 10 Javascript
AngularJS中的缓存使用
Jan 11 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
Mar 02 Javascript
jquery鼠标悬停导航下划线滑出效果
Sep 29 jQuery
iview tabs 顶部导航栏和模块切换栏的示例代码
Mar 04 Javascript
vue实现记事本功能
Jun 26 Javascript
JavaScript实现网页tab栏效果制作
Nov 20 Javascript
vue里使用create, mounted调用方法
Apr 26 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 学习资料零碎东西
2010/12/04 PHP
在Nginx上部署ThinkPHP项目教程
2015/02/02 PHP
PHP并发多进程处理利器Gearman使用介绍
2016/05/16 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
laravel 根据不同组织加载不同视图的实现
2019/10/14 PHP
javascript实现微信分享
2014/12/23 Javascript
Javascript中的getUTCDay()方法使用详解
2015/06/10 Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
2015/08/20 Javascript
利用HTML5的画布Canvas实现刮刮卡效果
2015/09/06 Javascript
基于jQuery实现返回顶部实例代码
2016/01/01 Javascript
给angular加上动画效遇到的问题总结
2016/02/17 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
2016/02/18 Javascript
Bootstrap自定义文件上传下载样式
2016/05/26 Javascript
jQuery简单注册和禁用全局事件的方法
2016/07/25 Javascript
BootstrapTable+KnockoutJS自定义T4模板快速生成增删改查页面
2016/08/01 Javascript
详解Node.Js如何处理post数据
2016/09/19 Javascript
详解angularjs获取元素以及angular.element()用法
2017/07/25 Javascript
nodejs爬虫初试superagent和cheerio
2018/03/05 NodeJs
webpack打包react项目的实现方法
2018/06/21 Javascript
Vue2.0实现简单分页及跳转效果
2019/07/29 Javascript
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
2019/10/25 Javascript
javascript设计模式 ? 工厂模式原理与应用实例分析
2020/04/09 Javascript
Python日期时间Time模块实例详解
2019/04/15 Python
python爬虫实现中英翻译词典
2019/06/25 Python
pandas DataFrame的修改方法(值、列、索引)
2019/08/02 Python
解决tensorflow读取本地MNITS_data失败的原因
2020/06/22 Python
英国家居用品和床上用品零售商:P&B Home
2020/01/16 全球购物
社区工作者先进事迹
2014/01/18 职场文书
见习期自我鉴定范文
2014/03/19 职场文书
大学毕业生个人自荐书
2014/07/02 职场文书
小学安全教育月活动总结
2014/07/07 职场文书
励志演讲稿大全
2014/08/21 职场文书
师德师风剖析材料
2014/09/30 职场文书
2019销售早会主持词
2019/06/27 职场文书
mysql事务对效率的影响分析总结
2021/10/24 MySQL
Redis 报错 error:NOAUTH Authentication required
2022/05/15 Redis