手机
当前位置:查字典教程网 >网页设计 >HTML5教程 >用html5实现语音搜索框的方法
用html5实现语音搜索框的方法
摘要:我们先看下他们的不同显示。下面是在火狐下的截图:下面这个是在chrome下的截图:能猜想到的,就是写的代码肯定是不兼容的。不过你会发现真是比...

 我们先看下他们的不同显示。

下面是在火狐下的截图:

1

下面这个是在chrome下的截图:

2

能猜想到的,就是写的代码肯定是不兼容的。不过你会发现真是比较简单的,就算你是前端初学者你也会明白

复制代码

代码如下:

其中参数的意义:

x-webkit-speech:就是让你的输入框的右边出现一个小话筒,有了语音的功能。

lang:则是 强制输入框里面的语音的语言种类,例如上面写的 lang="zh-CN"指的是简体中文。

x-webkit-grammar:指的是语音输入语法,"builtin:search”值使得语音输入的内容尽量靠近搜索内容,去除多余的字符。

注:不过这个硬件方面的兼容性还是有待提高,因为当你中英夹杂语音的时候,估计是会状况百出的。

【用html5实现语音搜索框的方法】相关文章:

用HTML5制作视频拼图的教程

纯html5+css3下拉导航菜单实现代码

使用html5 canvas创建太空游戏的示例

用HTML5的canvas实现一个炫酷时钟效果

html5调用音乐播放器的几种常用语法

html5实现多文件的上传示例代码

html5 canvas实现圆形时钟代码分享

HTML5的hidden属性兼容老浏览器的方法

基于html5实现的图片墙效果

html5 实现客户端验证上传文件的大小(简单实例)

精品推荐
分类导航