vue中进行微博分享的实例讲解


Posted in Javascript onOctober 14, 2019

1、首先要在页面写出点击可进行微博分享的入口,样式因自己项目而定:

<li class="bottomIcon_5 shareSina"><a href="javascript:;" rel="external nofollow" target="_blank"></a><div class="shareTxt">微博</div></li>

2、其次,对微博按钮进行点击事件,也就是最重要的进行微博分享的操作:

// 微博分享
      $('.shareSina').on('click', function () {
        window.sharetitle = $(".print-tit").html();//分享的标题
        window.shareUrl = $(".myShare img").attr('src');//分享显示的图片
        share();
      })
      function share() {
        (function(s, d, e) {
          try {} catch (e) {}
          var f = 'http://v.t.sina.com.cn/share/share.php?',
            u = window.location.href,
            p = ['url=', e(u), '&title=分享的名称', '&pic=', e(window.shareUrl)].join('');
      
          function a() {
            if (!window.open([f, p].join(''), 'mb', ['toolbar=0,status=0,resizable=1,width=620,height=450,left=', (s.width - 620) / 2, ',top=', (s.height - 450) / 2].join(''))) u.href = [f, p].join('');
          };
          if (/Firefox/.test(navigator.userAgent)) { setTimeout(a, 0) } else { a() }
        })(screen, document, encodeURIComponent);
      }

点击后会出现一个新弹窗的页面,页面内含有你要分享的图片及网站的名称、详情等,页面会跳转到新浪微博,如果你已经登录微博,那么会直接分享成功,如果没有登陆,会跳转到登录页面,登陆后直接分享成功。

3、这样微博就分享成功了!

以上就是本次介绍的全部知识点内容,感谢大家的学习和对三水点靠木的支持。

Javascript 相关文章推荐
jquery 插件实现图片延迟加载效果代码
Feb 06 Javascript
jquery动态添加删除div 具体实现
Jul 20 Javascript
JS基于Ajax实现的网页Loading效果代码
Oct 27 Javascript
一道常被人轻视的web前端常见面试题(JS)
Feb 15 Javascript
JavaScript中闭包之浅析解读(必看篇)
Aug 25 Javascript
domReady的实现案例
Nov 23 Javascript
angularJS+requireJS实现controller及directive的按需加载示例
Feb 20 Javascript
浅谈在Vue.js中如何实现时间转换指令
Jan 06 Javascript
vue实现移动端图片上传功能
Dec 23 Javascript
鸿蒙系统中的 JS 开发框架
Sep 18 Javascript
vue el-upload上传文件的示例代码
Dec 21 Vue.js
React如何创建组件
Jun 27 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
Oct 14 #Javascript
Vue3.0 响应式系统源码逐行分析讲解
Oct 14 #Javascript
微信小程序 textarea 层级过高问题简单解决方案
Oct 14 #Javascript
vue的路由映射问题及解决方案
Oct 14 #Javascript
浅谈Vue为什么不能检测数组变动
Oct 14 #Javascript
为什么Vue3.0使用Proxy实现数据监听(defineProperty表示不背这个锅)
Oct 14 #Javascript
Vue3.0中的monorepo管理模式的实现
Oct 14 #Javascript
You might like
基于mysql的论坛(6)
2006/10/09 PHP
PHP中fwrite与file_put_contents性能测试代码
2013/08/02 PHP
根据中文裁减字符串函数的php代码
2013/12/03 PHP
通过php添加xml文档内容的方法
2015/01/23 PHP
无需数据库在线投票调查php代码
2016/07/20 PHP
简述php环境搭建与配置
2016/12/05 PHP
javascript一些不错的函数脚本代码
2008/09/10 Javascript
比较全面的event对像在IE与FF中的区别 推荐
2009/09/21 Javascript
MC Dialog js弹出层 完美兼容多浏览器(5.6更新)
2010/05/06 Javascript
SWFObject 2.1以上版本语法介绍
2010/07/10 Javascript
jQuery EasyUI API 中文文档 - ComboBox组合框
2011/10/07 Javascript
js简单的表格添加行和删除行操作示例
2014/03/31 Javascript
JavaScript让Textarea支持tab按键的方法
2015/06/26 Javascript
AngularJS基础 ng-mouseenter 指令示例代码
2016/08/02 Javascript
javascript 注释代码的几种方法总结
2017/01/04 Javascript
Easyui笔记2:实现datagrid多行删除的示例代码
2017/01/14 Javascript
vue实现的网易云音乐在线播放和下载功能案例
2019/02/18 Javascript
ant design vue中表格指定格式渲染方式
2020/10/28 Javascript
NodeJS和浏览器中this关键字的不同之处
2021/03/03 NodeJs
[45:46]2014 DOTA2国际邀请赛中国区预选赛5.21 HGT VS DT
2014/05/23 DOTA
[06:07]刀塔密之二:攻之吾命受之吾幸
2014/07/03 DOTA
python使用selenium实现批量文件下载
2019/03/11 Python
Python 类,property属性(简化属性的操作),@property,property()用法示例
2019/10/12 Python
Beach Bunny Swimwear官网:设计师泳装和性感比基尼
2019/03/13 全球购物
ORLY官网:美国专业美甲一线品牌
2019/12/11 全球购物
Oasis服装官网:时尚女装在线
2020/07/09 全球购物
铁路个人事迹材料
2014/01/30 职场文书
2014幼儿园教育教学工作总结
2014/12/17 职场文书
投资意向协议书
2015/01/29 职场文书
2015国庆66周年宣传语
2015/07/14 职场文书
2015年乡镇食品安全工作总结
2015/10/22 职场文书
文艺部部长竞选稿
2015/11/21 职场文书
小学二年级语文教学反思
2016/03/03 职场文书
nginx里的rewrite跳转的实现
2021/03/31 Servers
python获取淘宝服务器时间的代码示例
2021/04/22 Python
vue-treeselect的基本用法以及解决点击无法出现拉下菜单
2022/04/30 Vue.js