分享功能可以利用插件share.js插件,也可以自己定义。只要知道各平台的分享地址及相应的参数赋值就可以了。//第一种方法

//引入插件

//分享功能

$scope.sharePoster = function(platform){

//获取需要分享的图片地址

var posterUrl=angular.element("#myPoster").attr("src");

if(!posterUrl){

var layer=document.createElement("div");

layer.id="layer";

layer.innerHTML="请先上传图片再分享哦!"

var style=

{

background:"#000000",

color:"#ffffff",

position:"absolute",

zIndex:10,

width:"484px",

height:"62px",

lineHeight:"61px",

textAlign:"center",

fontSize:"18px",

borderRadius:"10px",

opacity: 0.75,

left:"38%",

top:"45%"

}

for(var i in style)

layer.style[i]=style[i];

if(document.getElementById("layer")==null)

{

document.body.appendChild(layer);

setTimeout("document.body.removeChild(layer)",2000)

}

return

}

var link = '填入当前页面路径';

var image = posterUrl;

var title = '好好学习天天向上';

$('#shareposter').share({

url: link,

title: shareTitle,

description: shareTitle,

image: image,

sites: ['weibo','qq','qzone','douban']

});

var shareLink = $('#shareposter').find('.icon-'+platform).attr('href');

window.open(shareLink,'_blank');

}

//第二种方法

$scope.sharePoster = function(platform){

var link = '当前页面路径';

var image = '图片地址';

var title = '好好学习天天向上';

if (platform == "weibo") {

window.open("http://v.t.sina.com.cn/share/share.php?url=" + link + "&title=" + title + "&content=utf8&pic=" + image);

}

if (platform == "qq") {

window.open("https://connect.qq.com/widget/shareqq/index.html?url=" + link + "&title=" + title + "&pics=" + image);

}

if (platform == "qzone") {

window.open("http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=" + link + "&title=" + title  + "&pics=" + image +"&desc=" +title);

}

if (platform == "douban") {

window.open("http://www.douban.com/recommend/?url=" + link + "&title=" + title + "&image=" + image);

}

}

html分享到微博,前端实现分享内容到微博、QQ、QQ空间、豆瓣等平台相关推荐

  1. css前端知识分享—页面布局分析

    今天分享下"css前端知识分享-页面布局分析"这篇文章,文中根据实例编码详细介绍,或许对大家的编程之路有着一定的参考空间与使用价值,需要的朋友接下来跟着云南仟龙Mark一起学习一下 ...

  2. 前端Vue分享菜单按钮弹框、微博分享、QQ分享、微信好友、朋友圈

    前端Vue分享菜单按钮弹框.微博分享.QQ分享.微信好友.朋友圈 , 下载完整代码请访问uni-app插件市场址:https://ext.dcloud.net.cn/plugin?id=13085 效 ...

  3. 分享内容到微博、QQ空间、人人网、开心网等社区

    网上有不少分享内容到微博.QQ空间.人人网.开心网等社区的插件,但它们都有自己固定的样式,你不一定会喜欢. 或许你想保持你的网站的原状,添加上微博.QQ空间.人人网.开心网的LOGO图片,点击之后就可 ...

  4. 简单的前端网页分享功能怎么做?

    分享到某个平台 比如说网页上有一个按钮,分享到微博或QQ空间... 就用下面的方式 1.新浪微博 <a href="http://v.t.sina.com.cn/share/share ...

  5. 【027】基于Vue+Nodejs+Mysql模仿微博的图片分享系统(管理员、用户两种身份)(含源码、数据库、实验报告、运行教程)

    观前提醒:源码.数据库.实验报告在文末 该Web小型软件系统是基于图片分享的模仿微博社交平台,用户在里面可查看别人分享的内容,同时也可以发布自己的内容.在浏览分享的帖子中,用户可以进行点赞.评论.收藏 ...

  6. 好程序员web前端技术分享媒体查询

    为什么80%的码农都做不了架构师?>>>    好程序员web前端技术分享媒体查询 什么是媒体查询 媒体查询可以让我们根据设备显示器的特性(如视口宽度.屏幕比例.设备方向:横向或纵向 ...

  7. react render没更新_web前端教程分享React学习笔记(一)

    web前端教程分享React学习笔记(一),React的起源和发展:React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写 ...

  8. Android分享功能,微博、QQ、QQ空间等社交平台分享之入门与进阶

    前言 如何能迅速做一个分享功能,那主要就是根据第一个步骤来做就好了,因为友盟的sdk包已经集成很多的内容了,只要你有相应的app和平台账号就可以能马上分享.进阶的内容就是从第三部分开始,这些内容不难, ...

  9. js怎么定义combobox_好程序员web前端教程分享新手应该怎么学习webpack

    好程序员web前端教程分享新手应该怎么学习webpack,什么是webpack?一句话概括:webpack是一个模块打包工具(module bundler).重点在于两个关键词"模块&quo ...

  10. android qq分享自动弹出,史上最详细Android集成QQ,微信,微博分享(不要第三方)持续更新中...

    QQ1 下载sdk并运行demo 2 各种配置 IUiListener 4 分享图片41 分享到QQ 41 分享到QZONE Sina微博配置 选择集成sdk方式 分享图片 现在项目中用个第三方登录, ...

最新文章

  1. 使用 Telnet 仿冒任意邮件
  2. Csharp volatile 关键字
  3. blog推荐 - 软件产品管理之Tyner Blain
  4. 【C++ Primer】自己动手编写函数 atoi(char *str)
  5. Echarts中Option属性设置
  6. 虚拟环境创建,pip管理包
  7. Java中9大内置基本数据类型Class实例和数组的Class实例
  8. centos 安装openoffice (办公软件 WPS)
  9. import org.eclipse.californium.scandium.DTLSConnector;
  10. Android多媒体学习一:Android中Image的简单实例。
  11. gulp的安装和配置详解
  12. 19【推荐系统8】PNN模型——加强特征交叉能力
  13. Android File存储
  14. 魔兽争霸3地图(WarIII Maps):成神之路
  15. Lucene和Solr原理初探
  16. 六级病历对门诊电子病历系统功能要求的初步梳理
  17. 你的离职是为了事业还为了工作??
  18. prophet outliers异常值
  19. FPGA学习之数模转换(TLC5620)(通过4个按键输入,输出数模转换需要的数据和数码管显示需要的数据)
  20. 编程中的幂等性 —— HTTP幂等性

热门文章

  1. 旅游景点网站景区景点购票系统毕业设计毕业论文参考(3)后台管理功能
  2. 【操作系统】为什么需要内核
  3. hosts文件位置和修复hosts文件
  4. ubuntu install wiznote
  5. ❤️❤️固高运动控制卡的相关知识点
  6. java kml_从Java中的KML文件中提取坐标
  7. java实现爬虫_手把手教你从零开始用Java写爬虫
  8. IT项目管理之第7章 项目质量管理习题之案例分析汇总
  9. python读取shp文件,
  10. 基于JavaEE的班级管理系统设计与实现_信息管理__JSP网站设计_SQLServer数据库设计