基于bshare分享平台,在一个页面上实现多个不同内容的web分享
<!--引入bshare SDK-->
<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#uuid=&style=-1"></script>
<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC2.js"></script>
<div class="myCouponFoot bgcw global_do_share">
{foreach from=$user_prize_goods key=k item=v}
<div class="c web_share" style="display:none;" id="web_share_{$k}">
<div class="bshare-custom ">
<a title="分享到腾讯朋友" class="bshare-qqxiaoyou"></a>
<a title="分享到QQ空间" class="bshare-qzone"></a>
<a title="分享到微信" class="bshare-weixin"></a>
<a title="分享到新浪微博" class="bshare-sinaminiblog"></a>
<a title="分享到手机Qzone" class="bshare-mqzone"></a>
<a title="分享到人人网" class="bshare-renren"></a>
<a title="分享到开心网" class="bshare-kaixin001"></a>
<a title="分享到豆瓣" class="bshare-douban"></a>
<!-- 在这里添加更多平台 -->
</div>
<div class="modal-backdrop in"></div>
<script>
bShare.addEntry({
title:'{$v.goods_info.goods_name}',
url:url,
pic:'{$v.goods_info.goods_thumb}'
});
</script>
</div>
{/foreach}
</div>
官方文档说明如下:
如果您想为每个按钮指定不同分享内容,可以使用bShare.addEntry()方法(可参考自定义分享内容及图片)。 addEntry()的调用和bShare按钮是一一对应的,就是说页面中第N个按钮分享的就是第N个addEntry()调用指定的内容。如果按钮没有对应的 addEntry()调用,则分享的就是当前页面的相关内容。
官网帮助文档地址:http://www.bshare.cn/help/customMultipleButtons
但是官网没有明确说明,“addEntry()的调用和bShare按钮是一一对应的”这句话中,“bShare按钮”这个是怎么定义的。
经过测试,上文代码中,
<div class="bshare-custom ">
<a title="分享到腾讯朋友" class="bshare-qqxiaoyou"></a>
<a title="分享到QQ空间" class="bshare-qzone"></a>
<a title="分享到微信" class="bshare-weixin"></a>
<a title="分享到新浪微博" class="bshare-sinaminiblog"></a>
<a title="分享到手机Qzone" class="bshare-mqzone"></a>
<a title="分享到人人网" class="bshare-renren"></a>
<a title="分享到开心网" class="bshare-kaixin001"></a>
<a title="分享到豆瓣" class="bshare-douban"></a>
<!-- 在这里添加更多平台 -->
</div>
这段div识别为一个“bShare按钮”。
而官网是这样案例的:
要在一个页面放置多个按钮其实很简单,您可以在每个想要分享按钮出现的地方放置一个占位元素。如下:<a class="bshareDiv" href="http://www.bshare.cn/share">分享按钮
所以,只能自行测试摸索了。
基于bshare分享平台,在一个页面上实现多个不同内容的web分享的更多相关文章
- 如何在一个页面上让多个jQuery
如何在一个页面上让多个jQuery共存呢?比如jquery-1.5和jquery-1.11. 你可能会问,为什么需要在一个页面上让多个jQuery共存?直接引用最新版本的jQuery不行吗? 答案是, ...
- 把页面上的图表导出为pdf文件,分享一种请求下载文件的方法
最近客户提出一个需求,就是把页面上的图表导出为pdf文件. 找了很多资料.终于有了点头绪.最主要是参考了HighCharts的做法.http://www.hcharts.cn/ 实现原理:把页面图表的 ...
- 读取hdfs目录,并在web页面上展示文件里的内容
最终效果图 目录树实体类: /** * @Author: DaleyZou * @Description: hdfs 目录结构的实体类,用于展示目录树的支撑操作 * @Date: Created in ...
- 页面上下载canvas中的内容作为图片
使用如下代码,获得Canvas图像对应的data URI,也就是平常我们所说的base64地址 var dataUrl = document.getElementById("canvasId ...
- 分享一下我的部分毕设内容:基于Windows Phone平台的污染源管理应用
原文:分享一下我的部分毕设内容:基于Windows Phone平台的污染源管理应用 毕业半年,又总结了一下之前的工作,发现很多知识不复习都忘记了.最近新闻总是报道北京的空气污染,各种雾霾,各种PM X ...
- js检查页面上有无重复id的代码分享
用js代码检查一个页面上是否用重复的id. 方法一: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" ...
- C#开发微信门户及应用(41)--基于微信开放平台的扫码登录处理
在现今很多网站里面,都使用了微信开放平台的扫码登录认证处理,这样做相当于把身份认证交给较为权威的第三方进行认证,在应用网站里面可以不需要存储用户的密码了.本篇介绍如何基于微信开放平台的扫码进行网站的登 ...
- HTML5学堂 全新的HTML5/前端技术分享平台
HTML5学堂 全新的HTML5/前端技术分享平台 HTML5学堂是做什么的? HTML5学堂~http://www.h5course.com~由多名热爱H5的讲师们组成的一个组织.致力于构建一个前端 ...
- 【VMware虚拟化解决方案】 基于VMware虚拟化平台VDI整体性能分析与优化
一.说一说 本来打算将前期项目里面出现的问题的分析思路与解决方法写出来,第一.疏导一下自己的思路,第二.分析并找出自身在技术层面所存在欠缺.但由于每个人都有一根懒经所以迟迟未动.今天突然发现51CTO ...
随机推荐
- winScp上传文件时,如何过滤制定文件
在用winScp上传文件时,有些文件不想上传到服务器上.怎么办呢? 比如我希望过滤.svn .git文件和目录怎么操作呢? 第一步:在菜单上选中选项,点击选项. 第二步,点击传输->编辑 第三步 ...
- CF469D Two Set (并查集)
Codeforces Round #268 (Div. 2)D Codeforces Round #268 (Div. 1)B CF468B D. Two Sets time limit per te ...
- jquery选择器(三)-过滤选择器
一.基本过滤选择器 二.内容过滤选择器 1. 包含文本内容为“text”的元素 2. 含有某个选择器所匹配的父元素 3. 包含有子元素或者文本的父元素 4. 不含有子元素或者文本的父元素 三.可见性过 ...
- ubutu之Navicat安装
1.下载navicat111_premium_cs.tar.gz压缩包 2.进入压缩包所在目录,执行一下命令解压 tar -zxvf navicat111_premium_cs.r.gz 3.进入解压 ...
- Javascript高级程序设计——基本类型和引用类型的值
ECMAScript中的变量有两种不同的数据类型的值: 基本类型:基本类型的值是简单的数据段.包括:Undefined.Null.Number.Boolean.String五种 引用类型:引用类型的值 ...
- 循环执行n次的代码
var audio = document.createElement("audio"); var index = 0; audio.src = "piano/3C ...
- css小常识
static:对象遵循常规流.此时4个定位偏移属性不会被应用(即 没有声明position:relative, top.right.bottom.left不管用). 当position的值为非stat ...
- 实战Centos系统部署Codis集群服务
导读 Codis 是一个分布式 Redis 解决方案, 对于上层的应用来说, 连接到 Codis Proxy 和连接原生的 Redis Server 没有明显的区别 (不支持的命令列表), 上层应用可 ...
- smem – Linux 内存监视软件
导读 Linux 系统的内存管理工作中,内存使用情况的监控是十分重要的,在各种 Linux 发行版上你会找到许多这种工具.它们的工作方式多种多样,在这里,我们将会介绍如何安装和使用这样的一个名为 sm ...
- leetcode 278. First Bad Version
You are a product manager and currently leading a team to develop a new product. Unfortunately, the ...