写一个html电话验证页面代码,输入客户名称,客户密码,和客户电话,需要对输入的电话号码进行验证,电话号码符合以下规则:电话号码为数字,如果带地区号则在地区号与号码中插入-号,电话号码为8位数,地区号为空白或者四位数字,正确则弹出验证成功,错误则验证失败
时间: 2023-03-15 09:33:31 浏览: 61
这是一段符合要求的HTML代码:<html>
<head>
<title>电话验证</title>
</head>
<body>
<form action="">
<label>客户名称:<input type="text" name="name" /></label><br />
<label>客户密码:<input type="password" name="password" /></label><br />
<label>客户电话:<input type="text" name="phone" pattern="^\d{4}-\d{8}$|^\d{8}$" /></label><br />
<input type="submit" name="submit" value="提交" onclick="checkPhone()" />
</form>
<script>
function checkPhone(){
var phone = document.getElementsByName("phone")[0].value;
if (phone.length == 8 || (phone.length == 13 && phone.indexOf("-") == 4)) {
alert("验证成功!");
}else{
alert("验证失败!");
}
}
</script>
</body>
</html>
相关问题
写一个html登录页面代码,输入客户名称,客户密码,和客户电话,可以进行输入验证电话号码,重输则清空信息和退出(关闭页面)选项
<html>
<head>
<title>Login</title>
</head>
<body>
<h1>Login</h1>
<form action="login.php" method="post">
<p>Username: <input type="text" name="username" /></p>
<p>Password: <input type="password" name="password" /></p>
<p>Phone Number: <input type="tel" name="phone_number" oninput="verifyPhoneNumber(this)" /></p>
<input type="submit" value="Submit" />
</form>
<script>
function verifyPhoneNumber(input) {
if (input.value.length != 11) {
alert("Please enter a valid 11-digit phone number!");
input.value = "";
}
}
</script>
</body>
</html>
写一个html电话验证页面代码,输入客户名称,客户密码,和客户电话,需要对输入的电话号码进行验证,电话号码由地区码(空白或者四位数字组成),加连接符-号和8位数字,正确则弹出验证成功,错误则验证失败
以下是一个示例的html电话验证页面代码:<html>
<head>
<title>电话验证页面</title>
<script type="text/javascript">
function checkPhoneNumber(){
var phoneNumber = document.getElementById("phoneNumber").value;
var regex = /^\d{4}-\d{8}$/;
if(regex.test(phoneNumber)){
alert("验证成功!");
}else {
alert("验证失败!");
}
}
</script>
</head>
<body>
客户名称:<input type="text" name="customerName"/><br/>
客户密码:<input type="password" name="customerPassword"/><br/>
客户电话:<input type="text" name="phoneNumber" id="phoneNumber"/><br/>
<input type="button" value="验证" onclick="checkPhoneNumber()"/>
</body>
</html>
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)