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简单体验
Jan 10 Javascript
jQuery 下拉列表 二级联动插件分享
Mar 29 Javascript
浅析Javascript使用include/require
Nov 13 Javascript
推荐25个超炫的jQuery网格插件
Nov 28 Javascript
JavaScript数据结构与算法之栈详解
Mar 12 Javascript
JavaScript设置表单上传时文件个数的方法
Aug 11 Javascript
浅谈layer的iframe弹窗给里面的标签赋值的问题
Nov 10 Javascript
jQuery仿IOS弹出框插件
Feb 18 Javascript
vue使用 better-scroll的参数和方法详解
Jan 25 Javascript
vue 搭建后台系统模块化开发详解
May 01 Javascript
node.js的http.createServer过程深入解析
Jun 06 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 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
php中用foreach来操作数组的代码
2011/07/17 PHP
IE php关于强制下载文件的代码
2008/08/23 Javascript
jQuery中live方法的重复绑定说明
2011/10/21 Javascript
JavaScript导出Excel实例详解
2014/11/25 Javascript
js实现的牛顿摆效果
2015/03/31 Javascript
jQuery实现文件上传进度条特效
2015/08/12 Javascript
JavaScript实现多种排序算法
2016/02/24 Javascript
javascript创建含数字字母的随机字符串方法总结
2016/08/01 Javascript
概述javascript在Google IE中的调试技巧
2016/11/24 Javascript
JS实现div模块的截图并下载功能
2017/10/17 Javascript
微信小程序中添加客服按钮contact-button功能
2018/04/27 Javascript
atom-design(Vue.js移动端组件库)手势组件使用教程
2019/05/16 Javascript
JavaScript Window窗口对象属性和使用方法
2020/01/19 Javascript
Vue全局使用less样式,组件使用全局样式文件中定义的变量操作
2020/10/21 Javascript
vue 数据双向绑定的实现方法
2021/03/04 Vue.js
[00:35]DOTA2上海特级锦标赛 Newbee战队宣传片
2016/03/03 DOTA
Python实现模拟分割大文件及多线程处理的方法
2017/10/10 Python
使用Pyinstaller的最新踩坑实战记录
2017/11/08 Python
python os.listdir按文件存取时间顺序列出目录的实例
2018/10/21 Python
python使用pygame框架实现推箱子游戏
2018/11/20 Python
Python中一般处理中文的几种方法
2019/03/06 Python
TensorFlow 显存使用机制详解
2020/02/03 Python
在python中利用dict转json按输入顺序输出内容方式
2020/02/27 Python
Selenium python时间控件输入问题解决方案
2020/07/22 Python
python 如何调用 dubbo 接口
2020/09/24 Python
Python爬虫抓取论坛关键字过程解析
2020/10/19 Python
英国图书音像网站:Hive.co.uk(图书、电子书、DVD、蓝光、音乐CD等)
2017/10/16 全球购物
摩托车和ATV零件、配件和服装的首选在线零售商:MotoSport
2017/12/22 全球购物
英国婚礼商城:Wedding Mall
2019/11/02 全球购物
毕业生多媒体设计求职信
2013/10/12 职场文书
岗位职责定义及内容
2013/11/08 职场文书
天猫某品牌专卖店运营计划书
2014/03/21 职场文书
合作经营协议书
2014/04/17 职场文书
奉献爱心演讲稿
2014/09/04 职场文书
家长通知书家长意见
2015/06/03 职场文书
如何设计高效合理的MySQL查询语句
2021/05/26 MySQL