html5实现 input必须为手机号且非空的验证方法

html-css013

html5实现 input必须为手机号且非空的验证方法,第1张

<html>

<head>

<meta http-equiv="Content-Type" content="text/html charset=gb2312" />

<title>文哥讨厌IE</title>

<script language="javascript" type="text/javascript">

function checkMobile(str) {

    if(str==""){

        alert("手机号不能为空!")

    }

    else{

        var re = /^1\d{10}$/

        if (re.test(str)) {

            alert("正确")

        } else {

            alert("手机号格式错误!")

        }

    }

}

</script>

</head>

<body>

<input type="text" id="btn_getNum"/>

<input type="button" value="得到数字" onclick="checkMobile(btn_getNum.value)"/>

</body>

</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

}

}

H5就是html5。

html5是由万维网联盟于2014年10月29日宣布的HTML最新修订版本,html5目的是取代1999年所制定的HTML 4.01和XHTML 1.0标准。

html5新引进的语法特征能够在移动设备上支持多媒体,能更好的适应移动端设备。新的解析规则增强了灵活性、新属性、淘汰过时的或冗余的属性,真正地改变了用户与文档的交互方式。

扩展资料:

HTML5是Web中核心语言HTML的规范,用户使用任何手段进行网页浏览时看到的内容原本都是HTML格式的,在浏览器中通过一些技术处理将其转换成为了可识别的信息。HTML5在从前HTML4.01的基础上进行了一定的改进,虽然技术人员在开发过程中可能不会将这些新技术投入应用,但是对于该种技术的新特性,网站开发技术人员是必须要有所了解的。

HTML5将web带入一个成熟的应用平台,在这个平台上,视频、音频、图像、动画以及与设备的交互都是标准化的。表单是用户与页面背景交互的主要部分。HTML5在表单设计中更强大,输入类型和属性的多样性大大地增强了HTML可以表达的表单形式。

html5有一些新的表单标记,需要JavaScript的控件可以通过HTML5表单直接实现。利用HTML5智能表单属性标签还可以实现内容提示、焦点处理、数据验证等功能。

参考资料:百度百科-html5