让我的Javascript与HTML一起工作有困难
我正试图通过制作一个简单的表单来学习如何使用JavaScript,但它并不像我期望的那样工作。让我的Javascript与HTML一起工作有困难,javascript,html,css,Javascript,Html,Css,我正试图通过制作一个简单的表单来学习如何使用JavaScript,但它并不像我期望的那样工作。 我编写了一些我认为可以工作的验证函数,但我不明白为什么它们不能工作。 我可以通过Verify函数发出警报,但我调用的实际函数不会运行 这是我的全部代码 HTML Javascript var Age_Reg = /[0-9]/; var Email_Reg = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/; var Name_Reg = /[^A-Za-z0-9_'-]/;
我编写了一些我认为可以工作的验证函数,但我不明白为什么它们不能工作。
我可以通过Verify函数发出警报,但我调用的实际函数不会运行 这是我的全部代码 HTML Javascript
var Age_Reg = /[0-9]/;
var Email_Reg = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
var Name_Reg = /[^A-Za-z0-9_'-]/;
function Name_Verify() {
var Name = document.getElementById("Name_Input").value;
if (Name_Reg.test(Name)) {
} else {
document.getElementById("Name_Error").style.display = inline;
}
}
function Age_Verify() {
var Age = document.getElementById("Age_Input").value;
if (Age_Reg.test(Age)) {
} else {
document.getElementById("Age_Error").style.display = inline;
}
}
function Email_Verify() {
var Email = document.getElementById("Email_Input").value;
if (Email_Reg.test(Email)) {
} else {
document.getElementById("Email_Error").style.display = inline;
}
}
function Verify() {
Name_Verify();
Age_Verify();
Email_Verify();
}
您试图引用
inline
,就好像它是一个变量一样,我想您的意思是使用引号<代码>“内联”是否有任何错误?您在控制台中看到了什么?另外document.getElementById(“年龄错误”).style.display=inline代码>不起作用inline
是一个字符串,它应该是'inline'
。注意引号。uncaughtreferenceerror:inline没有定义哦,天哪,我不敢相信我没有注意到这一点。我现在感觉好笨。非常感谢你的帮助!非常欢迎:)不需要窗口。onload
包装器。单击submit按钮时,这些函数将启动,此时应该已经加载了DOM。
html, body {
height: 100%;
width: 100%;
}
* {
padding: 0px;
margin: 0px;
}
#wrapper {
height: 100%;
width: 80%;
max-width: 1500px;
min-width: 800 px;
background-color: black;
margin-left: auto;
margin-right: auto;
box-shadow: 0px 0px 20px black;
}
#Column_Left {
height: 100%;
width: 50%;
background-color: LightGreen;
float: left;
}
#Column_Right {
height: 100%;
width: 50%;
background-color: Purple;
float: right;
}
#Header {
height: 10%;
width: 100%;
}
#Link_One {
display: inline-block;
text-align: center;
height: 100%;
width: 19.5%;
background-color: DodgerBlue;
}
#Link_Two {
display: inline-block;
text-align: center;
height: 100%;
width: 19.5%;
background-color: DodgerBlue;
}
#Link_Three {
display: inline-block;
text-align: center;
height: 100%;
width: 19.5%;
background-color: DodgerBlue;
}
#Link_Four {
display: inline-block;
text-align: center;
height: 100%;
width: 19.5%;
background-color: DodgerBlue;
}
#Link_Five {
display: inline-block;
text-align: center;
height: 100%;
width: 19.5%;
background-color: DodgerBlue;
}
.Link {
border: 1px solid black;
}
.Link p {
line-height: 400%;
}
#Name_Error {
display: none;
}
#Age_Error {
display: none;
}
#Email_Error {
display: none;
}
var Age_Reg = /[0-9]/;
var Email_Reg = /^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/;
var Name_Reg = /[^A-Za-z0-9_'-]/;
function Name_Verify() {
var Name = document.getElementById("Name_Input").value;
if (Name_Reg.test(Name)) {
} else {
document.getElementById("Name_Error").style.display = inline;
}
}
function Age_Verify() {
var Age = document.getElementById("Age_Input").value;
if (Age_Reg.test(Age)) {
} else {
document.getElementById("Age_Error").style.display = inline;
}
}
function Email_Verify() {
var Email = document.getElementById("Email_Input").value;
if (Email_Reg.test(Email)) {
} else {
document.getElementById("Email_Error").style.display = inline;
}
}
function Verify() {
Name_Verify();
Age_Verify();
Email_Verify();
}