修改这段代码验证输入的电子邮件是否符合规范并弹出提示框 <script type="text/javascript"> function validateemail() { var email1=document.getElementById("Email").value; var reg_expression=/^[A-Za-z_]+([\w-\.]+)([A-Za-z]+)@((\w[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})$/i; var result=reg_expression.test(email1); if(result) alert("E-mail格式正确"); else alert("E-mail格式不正确"); } </script> </head> <body> <input type="text" id="Email" /> <input type="button" onclick="validateemail()" value="测试" />
时间: 2024-03-27 22:40:24 浏览: 129
下面是修改后的代码,主要是将提示框改为在页面上显示,而不是使用alert弹出:
```javascript
function validateEmail() {
var email = document.getElementById("Email").value;
var regExp = /^[A-Za-z_]+([\w-\.]+)([A-Za-z]+)@((\w[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})$/i;
var result = regExp.test(email);
var msg = document.createElement("div");
msg.style.marginTop = "5px";
if (result) {
msg.innerHTML = "E-mail格式正确";
msg.style.color = "green";
} else {
msg.innerHTML = "E-mail格式不正确";
msg.style.color = "red";
}
document.getElementById("Email").parentNode.appendChild(msg);
}
```
在这个修改后的代码中,我们首先使用了更具语义化的函数名validateEmail(小写的e)代替原来的validateemail。其次,我们将原来的变量名email1改为了email,并且将正则表达式对象的变量名reg_expression改为了更简洁的regExp。接下来,我们使用了document.createElement方法创建了一个div元素,并将验证结果显示在该元素中。如果验证通过,我们就将该元素的文本内容设置为“E-mail格式正确”,并将其字体颜色设置为绿色;否则,我们就将该元素的文本内容设置为“E-mail格式不正确”,并将其字体颜色设置为红色。最后,我们使用parentNode和appendChild方法将该div元素添加到Email输入框的父元素中。这样,用户在点击“测试”按钮之后,就可以在输入框下方看到验证结果。
阅读全文