一、在网页头部加入分享标题和url,代码如下:

<meta name="whatsapp:url" class="share_url" content="http://www.abc.com">
<meta name="whatsapp:title" class="share_title" content="测试分享到whatsapp">

二、HTML代码如下:

<a href="javascript:whatsApp();" class="xq-whatsapp" data-action="share/whatsapp/share"></a>

三、JavaScript代码如下:

<script>
function whatsApp(contentId){ u = document.getElementsByClassName("share_url")[0].content; t = document.getElementsByClassName("share_title")[0].content; location="whatsapp://send?text="+ encodeURIComponent(t) + encodeURIComponent("\n\n"+u)+"&via=lopscoop"; }
</script>

HTML5网页点击分享到whatsapp的更多相关文章

  1. 手机QQ内置网页,微信内置网页中进行分享到QQ和微信的操作

    微信内的网页分享: API内容详见微信开发文档  https://mp.weixin.qq.com/wiki 这里需要注意的是:调用微信API的时候修改的是微信内网页右上角三个点那里打开后,选择分享之 ...

  2. 20款响应式的 HTML5 网页模板【免费下载】

    下面的列表集合了20款响应式的 HTML5 网页模板,这些专业的模板能够让你的网站吸引很多的访客.除了好看的外观,HTML5 模板吸引大家的另一个原因是由于其响应性和流动性.赶紧来看看. 您可能感兴趣 ...

  3. html5网页动画总结--jQuery旋转插件jqueryrotate

    CSS3 提供了多种变形效果,比如矩阵变形.位移.缩放.旋转和倾斜等等,让页面更加生动活泼有趣,不再一动不动.然后 IE10 以下版本的浏览器不支持 CSS3 变形,虽然 IE 有私有属性滤镜(fil ...

  4. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(二)

    最近新浪.百度.腾讯.京东.大众点评.淘宝等流行的网站都加大了招聘HTML5的力度,HTML5开发人员成了抢手货,本次连载的是由大众点评前端工程师和一淘网前端工程师基情奉献的<HTML5网页开发 ...

  5. 浅谈html5网页内嵌视频

    更好的阅读体验:浅谈html5网页内嵌视频 如今在这个特殊的时代下:flash将死未死,微软和IE的历史问题,html5标准未定,苹果和谷歌的闭源和开源之争,移动互联网的大势所趋,浏览器各自为战... ...

  6. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(六)媒体查询

    响应式设计的另一个重要技术手段是媒体查询.如果只是简单的设计一个流式布局系统,那么可以保证每个网格按比例的放大和缩小,但有可能会使得在小屏幕下(如手机设备)网格太小而严重影响阅读,这样的设计称不上响应 ...

  7. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(五)图解通过Fiddler加速开发

    Fiddler是Windows底下最强大的请求代理调试工具,监控任何浏览器的HTTP/HTTPS流量,窜改客户端请求和服务器响应,解密HTTPS Web会话,图4.44为Fiddler原理示意图. 图 ...

  8. 《HTML5网页开发实例详解》连载(四)HTML5中的FileSystem接口

    HTML 5除了提供用于获取文件信息的File对象外,还添加了FileSystem相关的应用接口.FileSystem对于不同的处理功能做了细致的分类,如用于文件读取和处理的FileReader和Fi ...

  9. 免费的HTML5连载来了《HTML5网页开发实例详解》连载(三)DOCTYPE和字符集

    在2.1.2节中通过新老DOCTYPE的对比,读者可以清晰地看到HTML 5在精简旧有结构上做出的努力.DOCTYPE在出现之初主要用于XML中,用作描述XML允许使用的元素.属性和排列方式.起初HT ...

随机推荐

  1. 安卓 App 性能专项测试指标之 CPU 深度解析

    指标背景 很多场景下我们去使用App,可能会碰到手机会出现发热发烫的现象.这是因为CPU使用率过高.CPU过于繁忙,会使得整个系统无法响应用户,整体性能降低,用户体验变得相当差,也容易引起ANR等等一 ...

  2. mysql error 2005 - Unknown MySQL server host 'localhost'(11001)

    有的时候偶尔会出现这个问题 2005 Unknown MySQL server host 'localhost' (11001),刚开始重启电脑ok了,但是不能每次出现这个问题就重启电脑吧,太麻烦了, ...

  3. Django+xadmin打造在线教育平台(一)

    目录 在线教育平台(一)      在线教育平台(二) 在线教育平台(三)      在线教育平台(四) 在线教育平台(五)      在线教育平台(六) 在线教育平台(七)      在线教育平台( ...

  4. Mybatis之旅第二篇-Mapper动态代理方式

    一.引言 通过上一篇mybatis的入门学习,我们已经会使用mybatis实现简单的增删改查,但是我们也发现了用原始Dao开发的一些问题: Dao方法体存在重复代码:通过SqlSessionFacto ...

  5. 【hashMap】详谈

    官方文档地说明 几个关键的信息:基于Map接口实现.允许null键/值.非同步.不保证有序(比如插入的顺序).也不保证序不随时间变化. 一.概述 HashMap 是一个散列表,它存储的内容是键值对(k ...

  6. MySQL系列--3.数据类型和连接查询

    1.存储引擎 数据创建,查询,更新和删除操作都是通过数据引擎来进行的.不同的存储引擎存储限制不同,支持不同的索引机制等. 查询数据库支持的存储引擎 MySQL 5.7.2支持的存储引擎有:InnoDB ...

  7. zxing 如何识别反转二维码

    说起二维码扫描,估计很多人用的是 zxing 吧. 然而 zxing 虽然好用,但是却有一些坑. 这边分析一下自己实际项目遇到的一个坑. 什么坑呢? 下面举个栗子你就懂了. 这边生成二维码使用的是网络 ...

  8. 表单数据验证方法(一)—— 使用validate.js实现表单数据验证

    摘要:使用validate.js在前端实现表单数据提交前的验证 好久没写博客了,真的是罪过,以后不能这样了,只学习不思考,学的都是白搭,希望在博客园能记录下自己学习的点滴,虽然记录的都是些浅显的技术, ...

  9. Nginx + Keepalived实现应用高可用负载均衡功能

    说明:此处仅介绍 Keepalived 实现nginx负载均衡器的高可用,关于nginx介绍和负载均衡实现可查看我的另两篇博文 Nginx负载均衡 和 Nginx配置了解 应用背景:实现高可用,避免单 ...

  10. 设计模式系列6:适配器模式(Adapter Pattern)

    定义 将一个类的接口转换成客户希望的另一个接口,适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作.    --<设计模式>GoF UML类图 使用场景 在遗留代码复用,类 ...