[032] 微信公众帐号开发教程第8篇-文本消息中使用网页超链接(转)

简介:

本文主要介绍网页超链接的作用以及怎样在文本消息中使用网页超链接。

 

网页超链接的作用

我想但凡是熟悉HTML的朋友,对超链接一定不会陌生。而今天我们要讨论和使用的仅仅是超链接中的当中一种---网页超链接,即使用HTML中的<a>标签将某段文字链接到其它网页上去,示比例如以下:

 

[html]  view plain copy
 
  1. <a href="http://blog.csdn.net/lyq8479">柳峰的博客</a>  

上面是一段标准的HTML代码,实现了一个网页超链接,即将“柳峰的博客”5个字链接到了博客主页URL,当“柳峰的博客”5个字时,会打开http://blog.csdn.net/lyq8479所指向的网页。

 

怎样在文本消息中使用网页超链接

事实上,不知道怎样在文本消息中使用网页超链接的开发人员差点儿100%都熟悉HTML,特别是对HTML中的<a>标签再熟悉只是了。那究竟在微信公众帐号的文本消息中使用超链接有什么特别之处呢?为什么如此多的朋友都以前在这个问题上栽过跟头?我们先来看在微信中两种错误使用超链接的方法:

错误使用方法1(a标签的href属性值未被引號引起):

 

[html]  view plain copy
 
  1. <a href=http://blog.csdn.net/lyq8479>柳峰的博客</a>  

错误使用方法2(a标签的href属性值被单引號引起):

[html]  view plain copy
 
  1. <a href='http://blog.csdn.net/lyq8479'>柳峰的博客</a>  

在做Web开发时,以上两种写法都是能够的,可是放在微信公众帐号的文本消息中,这两种写法都是错误的,网页超链接并不会起作用,而且在Android手机上还会将HTML代码原样显示出来,例如以下图所看到的:

Android手机上的效果:

iPhone手机上的效果:

能够看出,在微信上,HTML的a标签属性值不用引號引起,或者使用单引號引起,都是错误的写法(在iPhone上,a标签属性href的值用单引號是正常的)。正确的使用方法是将a标签href属性的值用双引號引起,代码例如以下:

[html]  view plain copy
 
  1. <a href="http://blog.csdn.net/lyq8479">柳峰的博客</a>  

这样在Android和iPhone手机上,都能够正确显示超链接,而且点击该超链接,会使用微信内置浏览器打开http://blog.csdn.net/lyq8479

提示:在測试微信公众帐号时,不要仅仅是在自己的手机上測试通过就认为全然没问题了,由于眼下微信公众帐号上有好几处在Android和iOS平台上表现不一致。

本文转自博客园知识天地的博客,原文链接:[032] 微信公众帐号开发教程第8篇-文本消息中使用网页超链接(转),如需转载请自行联系原博主。


相关文章
|
3月前
|
JSON 小程序 前端开发
towxml的使用,在微信小程序中快速将markdown格式渲染为wxml文本
本文介绍了在微信小程序中使用`towxml`库将Markdown格式文本渲染为WXML的方法。文章提供了`towxml`的概述、安装步骤、以及如何在小程序中配置和使用`towxml`进行Markdown解析的详细说明和代码示例。
|
3月前
详细教程:扫码提交表单后,数据直接推送到企业微信、钉钉、飞书群聊
在草料制作的表单中,填表人扫码填写并提交数据后,这些信息可以立即通过企业微信、钉钉或飞书自动推送到相应的群聊中,实现即时共享和沟通,提升团队协作效率。
|
4月前
|
小程序 编译器 数据安全/隐私保护
小白保姆级教程:微信公众号开发,从0到1
【8月更文挑战第8天】小白保姆级教程:微信公众号开发,从0到1
314 3
小白保姆级教程:微信公众号开发,从0到1
|
4月前
|
前端开发
一键复制微信聊天框效果:HTML+CSS让网页聊天更生动!
一键复制微信聊天框效果:HTML+CSS让网页聊天更生动!
|
5月前
|
前端开发 小程序
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
【微信小程序-原生开发】实用教程20 - 生成海报(实战范例为生成活动海报,内含生成指定页面的小程序二维码,保存图片到手机,canvas 系列教程)
420 0
|
5月前
|
小程序 前端开发
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
276 0
|
5月前
|
小程序
【微信小程序-原生开发】实用教程21 - 分包
【微信小程序-原生开发】实用教程21 - 分包
391 0
|
5月前
|
小程序 C++
【微信小程序-原生开发】实用教程19 - 表单范例 VS 表单校验(含必填校验函数封装,实时数字校验)
【微信小程序-原生开发】实用教程19 - 表单范例 VS 表单校验(含必填校验函数封装,实时数字校验)
92 0
|
2月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
633 7
|
2月前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
726 1