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客户端解决方案 缓存提供程序
Jul 14 Javascript
javascript获取当前日期时间及其它操作函数
Jan 11 Javascript
小试JQuery的AutoComplete插件
May 04 Javascript
30个精美的jQuery幻灯片效果插件和教程
Aug 23 Javascript
js中判断对象是否为空的三种实现方法
Dec 23 Javascript
javascript将浮点数转换成整数的三个方法
Jun 23 Javascript
Javascript实现快速排序(Quicksort)的算法详解
Sep 06 Javascript
jQuery满屏焦点图左右滚动特效代码分享
Sep 07 Javascript
vue超时计算的组件实例代码
Jul 09 Javascript
微信小程序常用简易小函数总结
Feb 01 Javascript
Node.js API详解之 zlib模块用法分析
May 19 Javascript
微信小程序自定义联系人弹窗
May 26 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
数据库的日期格式转换
2006/10/09 PHP
一个可以找出源代码中所有中文的工具
2006/10/25 PHP
php中函数的形参与实参的问题说明
2010/09/01 PHP
Windows7下的php环境配置教程
2015/02/28 PHP
php版微信公众平台接口开发之智能回复开发教程
2016/09/22 PHP
php学习笔记之字符串常见操作总结
2019/07/16 PHP
javascript编程起步(第四课)
2007/01/10 Javascript
javascript获取函数名称、函数参数、对象属性名称的代码实例
2014/04/12 Javascript
详解jquery中$.ajax方法提交表单
2014/11/03 Javascript
JS实现设置ff与ie元素绝对位置的方法
2016/03/08 Javascript
全面了解JavaScirpt 的垃圾(garbage collection)回收机制
2016/07/11 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
详解vue的双向绑定原理及实现
2019/05/05 Javascript
Taro UI框架开发小程序实现左滑喜欢右滑不喜欢效果的示例代码
2020/05/18 Javascript
[04:11]DOTA2上海特级锦标赛主赛事首日TOP10
2016/03/03 DOTA
[01:31:22]DOTA2-DPC中国联赛定级赛 LBZS vs Magma BO3第二场 1月10日
2021/03/11 DOTA
Python的一些用法分享
2012/10/07 Python
简单介绍Python中的readline()方法的使用
2015/05/24 Python
使用Turtle画正螺旋线的方法
2017/09/22 Python
Python中optparser库用法实例详解
2018/01/26 Python
Anaconda2下实现Python2.7和Python3.5的共存方法
2018/06/11 Python
Python enumerate函数遍历数据对象组合过程解析
2019/12/11 Python
浅谈Selenium+Webdriver 常用的元素定位方式
2021/01/13 Python
HTML5 form标签之解放表单验证、增加文件上传、集成拖放的使用方法
2013/04/24 HTML / CSS
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
学生就业推荐信
2013/11/13 职场文书
致跳远、跳高运动员广播稿
2014/01/09 职场文书
我的教育故事演讲稿
2014/05/04 职场文书
班主任与学生安全责任书
2014/07/25 职场文书
卖车协议书范例
2014/09/16 职场文书
部门群众路线教育实践活动对照检查材料思想汇报
2014/10/07 职场文书
仙境之桥观后感
2015/06/16 职场文书
解决Vue+SpringBoot+Shiro跨域问题
2021/06/09 Vue.js
Python上下文管理器Content Manager
2021/06/26 Python
mysql 体系结构和存储引擎介绍
2022/05/06 MySQL
spring 项目实现限流方法示例
2022/07/15 Java/Android