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 相关文章推荐
怎么让脚本或里面的函数在所有图片都载入完毕的时候执行
Oct 17 Javascript
JavaScript 三种不同位置代码的写法
Oct 25 Javascript
什么是json和jsonp,jQuery json实例详详细说明
Dec 11 Javascript
使用js的replace()方法查找字符示例代码
Oct 28 Javascript
js根据日期判断星座的示例代码
Jan 23 Javascript
js使用Array.prototype.sort()对数组对象排序的方法
Jan 28 Javascript
JavaScript的Polymer框架中dom-repeat与VM的相关操作
Jul 29 Javascript
轻松实现Bootstrap图片轮播
Apr 20 Javascript
jQuery实现点击后高亮背景固定显示的菜单效果【附demo源码下载】
Sep 21 Javascript
angular4自定义组件详解
Sep 28 Javascript
ES6 proxy和reflect的使用方法与应用实例分析
Feb 15 Javascript
React.js组件实现拖拽排序组件功能过程解析
Apr 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
DOTA2 探索永无止境 玩家自创强悍插眼攻略
2020/04/20 DOTA
无线电广播与收音机发展的历史回眸
2021/03/02 无线电
介绍一些PHP判断变量的函数
2012/04/24 PHP
php while循环得到循环次数
2013/10/26 PHP
PHP模板解析类实例
2015/07/09 PHP
[原创]php集成安装包wampserver修改密码后phpmyadmin无法登陆的解决方法
2016/11/23 PHP
Zend Framework入门教程之Zend_Mail用法示例
2016/12/08 PHP
Javascript注入技巧
2007/06/22 Javascript
IE autocomplete internet explorer's autocomplete
2007/06/30 Javascript
Javascript 圆角div的实现代码
2009/10/15 Javascript
鼠标滚轮控制网页横向移动实现思路
2013/03/22 Javascript
jQuery ui插件的使用方法代码实例
2013/05/08 Javascript
js 设置缓存及获取设置的缓存
2014/05/08 Javascript
使用jQuery实现input数值增量和减量的方法
2015/01/24 Javascript
Angular组件化管理实现方法分析
2017/03/17 Javascript
Angular HMR(热模块替换)功能实现方法
2018/04/04 Javascript
vue中如何实现pdf文件预览的方法
2018/07/12 Javascript
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
JavaScript数据结构与算法之二叉树插入节点、生成二叉树示例
2019/02/21 Javascript
python pandas dataframe 行列选择,切片操作方法
2018/04/10 Python
基于python3 pyQt5 QtDesignner实现窗口化猜数字游戏功能
2019/07/15 Python
python3 动态模块导入与全局变量使用实例
2019/12/22 Python
opencv之为图像添加边界的方法示例
2019/12/26 Python
Python+OpenCV实现图像的全景拼接
2020/03/05 Python
Python网页解析器使用实例详解
2020/05/30 Python
如何用Python 加密文件
2020/09/10 Python
几个CSS3的flex弹性盒模型布局的简单例子演示
2016/05/12 HTML / CSS
AmazeUI 点击元素显示全屏的实现
2020/08/25 HTML / CSS
英国第一蛋白粉品牌:Myprotein
2016/09/14 全球购物
现金会计岗位职责
2013/12/05 职场文书
经贸专业毕业生求职信
2014/03/23 职场文书
计算机系本科生求职信
2014/05/31 职场文书
党支部考察意见范文
2015/06/02 职场文书
教师纪律作风整顿心得体会
2016/01/23 职场文书
大学生党员暑假实践(活动总结)
2019/08/21 职场文书
Python爬取奶茶店数据分析哪家最好喝以及性价比
2022/09/23 Python