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 相关文章推荐
Javascript 获取字符串字节数的多种方法
Jun 02 Javascript
IE event.srcElement和FF event.target 功能比较
Mar 01 Javascript
javascript中的作用域scope介绍
Dec 28 Javascript
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
Apr 12 Javascript
使用jQuery操作Cookies的实现代码
Oct 09 Javascript
JavaScript代码实现左右上下自动晃动自动移动
Apr 08 Javascript
用javascript获取任意颜色的更亮或更暗颜色值示例代码
Jul 21 Javascript
AngularJS中下拉框的基本用法示例
Oct 11 Javascript
使用Vue组件实现一个简单弹窗效果
Apr 23 Javascript
vue中@change兼容问题详解
Oct 25 Javascript
Layui实现数据表格默认全部显示(不要分页)
Oct 26 Javascript
Vue请求java服务端并返回数据代码实例
Nov 28 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添加MySQL数据记录代码
2008/06/07 PHP
php顺序查找和二分查找示例
2014/03/27 PHP
CodeIgniter框架提示Disallowed Key Characters的解决办法
2014/04/21 PHP
Yii2主题(Theme)用法详解
2016/07/23 PHP
几行代码轻松实现PHP文件打包下载zip
2017/03/01 PHP
PHP hex2bin()函数用法讲解
2019/02/25 PHP
Thinkphp框架使用list_to_tree 实现无限级分类列出所有节点示例
2020/04/04 PHP
javascript YUI 读码日记之 YAHOO.util.Dom - Part.4
2008/03/22 Javascript
jquery判断字符输入个数(数字英文长度记为1,中文记为2,超过长度自动截取)
2010/10/15 Javascript
autoIMG 基于jquery的图片自适应插件代码
2011/03/12 Javascript
基于jquery的图片幻灯展示源码
2012/07/15 Javascript
javascript怎么禁用浏览器后退按钮
2014/03/27 Javascript
JavaScript 学习笔记之数据类型
2015/01/14 Javascript
JavaScript实现更改网页背景与字体颜色的方法
2015/02/02 Javascript
微信小程序 前端源码逻辑和工作流详解
2016/10/08 Javascript
详解vue 模拟后台数据(加载本地json文件)调试
2017/08/25 Javascript
微信小程序 配置顶部导航条标题颜色的实现方法
2017/09/20 Javascript
form表单数据封装成json格式并提交给服务器的实现方法
2017/12/14 Javascript
小程序实现左右来回滚动字幕效果
2018/12/28 Javascript
开源一个微信小程序仪表盘组件过程解析
2019/07/30 Javascript
javascript导出csv文件(excel)的方法示例
2019/08/25 Javascript
JS如何实现动态添加的元素绑定事件
2019/11/12 Javascript
javascript实现鼠标点击生成文字特效
2019/12/24 Javascript
JS定时器如何实现提交成功提示功能
2020/06/12 Javascript
微信小程序连续签到7天积分获得功能的示例代码
2020/08/20 Javascript
vue组件实现移动端九宫格转盘抽奖
2020/10/16 Javascript
python实现大转盘抽奖效果
2019/01/22 Python
基于python使用tibco ems代码实例
2019/12/20 Python
Python使用Tkinter实现转盘抽奖器的步骤详解
2020/01/06 Python
Python接收手机短信的代码整理
2020/08/02 Python
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
美国在线乐器和设备商店:Musician’s Friend
2018/07/06 全球购物
五型班组建设方案
2014/02/10 职场文书
音乐兴趣小组活动总结
2014/07/07 职场文书
质量保证书格式
2015/02/27 职场文书
mybatis 解决从列名到属性名的自动映射失败问题
2021/06/30 Java/Android