原生的H5如何实现直接拨打电话?

html-css031

原生的H5如何实现直接拨打电话?,第1张

在 HTML5 中,可以使用 <a>标签的 href 属性来实现直接拨打电话的功能,具体方法如下:

Copy code<a href="tel:10086">拨打电话</a>

在上面的代码中,tel:10086 就是指定的电话号码,用户点击按钮后,就会直接拨打 10086 这个电话号码。

注意,这种方式只能在移动端使用,PC 端浏览器不会响应这个链接。

这样写:<a href="tel:123456789">拨号</a>

HTML 运行在手机浏览器上的可以调用手机的拨号就是你想要拨打的电话号码在页面中看到“拨号”的字样,点一下,就会自动跳到拨打电话的页面啦。这种方式塞班、安卓与iphone都支持。

例如:

<a href=”javascript:phone('+phone+') ”>拨打电话</a>

function phone(date)

{

window.location.href = 'tel://' + date

}

用html制作可以拨打电话的链接其实是一个简单的程序可以试着写一些简单的。

html5中input的tel类型验证正则的写法如下:

一般在中国,电话号码是区号-7到8位数字的电话号码,所以正则表达式书写如下:

^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}

完整的演示例子如下:

1、html5中的tel标签:

<input type="tel" name="tel" id="tel" required pattern="^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}">

2、或者

<input type="tel" name="tel" id="tel" required onblur="checkme(this)"/>

function checkme(obj){

var val=obj.value()

var mobilevalid = /^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}$/

if (!mobilevalid.test(val)) {

alert('请输入正确的手机号码!')

return false

}

}