Javascript 试图用错误消息验证我的表单,似乎不起作用
我想用相同的函数传入不同的元素IDJavascript 试图用错误消息验证我的表单,似乎不起作用,javascript,Javascript,我想用相同的函数传入不同的元素ID function validate(idname, spnname) { var getId = document.getElementById(idname); if(getId === null || getId === undefined || getId === "") { var getSpn = document.getElementById(spnname).innerHTML = "Required Field"; } }
function validate(idname, spnname) {
var getId = document.getElementById(idname);
if(getId === null || getId === undefined || getId === "") {
var getSpn = document.getElementById(spnname).innerHTML = "Required Field";
}
}
validate('firstname', 'spnfirstname');
<body>
<h1>SUBSCRIBE</h1>
<form id="frml" method="get" >
<input type="text" name="fname" placeholder="First Name" class="textbox" id="firstname"/><span id="spnfirstname"></span><br />
<input type="text" name="lname" placeholder="Last Name" s="textbox" id="lastname"/><span id="spnlastname"></span><br />
<input type="date" name="Birthday" value="" class="textbox" id="birthday"/>
<span id="spnbirthday"></span><br />
<input type="email" name="" placeholder="someone@example.com" class="textbox" id="email"/><span id="spnemail"></span><br />
<input type="tel" name="" placeholder="Home Phone" class="textbox" id="homep"/><span id="spnhomep"></span><br />
<input type="tel" name="" placeholder="Cell Phone" class="textbox" id="cellp"/><span id="spncellp"></span><br />
//is there another way to do this onClick event in javascript that may help?
<input id ="btn" type="button" value="Submit" onClick = "return validate()"/>
</form>
</div>
我收到了第二个var和html onClick的错误。我的问题不同,因为这里没有正确回答这个问题的答案。我什么都试过了。我不知道为什么会收到此错误消息。如果您试图在提交时验证所有元素,请单击 您可以使用querySelector选择所有元素,然后检查每个元素的值。如果值为,则更改同级span元素的innerHTML var submit=document.querySelectorbtn submit.AddEventListener单击,函数{ var元素=document.querySelectorAllinput; 对于变量i=0;i
var getId = document.getElementById(idname).value;
2.-将函数设置为“click”事件,如果您想使用纯javaScript,则addEventListener可能非常有用,就在表单之后:
<script>
document.getElementById('btn').addEventListener('click', function(){validate('firstname', 'spnfirstname');});
</script>
我就是这样让它工作的
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function validate(idname, spnname){
var getId = document.getElementById(idname).value;
console.log(getId);
if(getId === null || getId === undefined || getId === ""){
var getSpn = document.getElementById(spnname).innerHTML = "Required Field";
}
}
</script>
</head>
<body>
<h1>SUBSCRIBE</h1>
<form id="frml" method="get">
<input type="text" name="fname" placeholder="First Name" class="textbox" id="firstname"/><span id="spnfirstname"></span><br/>
<input type="text" name="lname" placeholder="Last Name" class="textbox" id="lastname"/><span id="spnlastname"></span><br/>
<input type="date" name="Birthday" value="" class="textbox" id="birthday"/>
<span id="spnbirthday"></span><br/>
<input type="email" name="" placeholder="someone@example.com" class="textbox" id="email"/><span id="spnemail"></span><br/>
<input type="tel" name="" placeholder="Home Phone" class="textbox" id="homep"/><span id="spnhomep"></span><br/>
<input type="tel" name="" placeholder="Cell Phone" class="textbox" id="cellp"/><span id="spncellp"></span><br/>
//is there another way to do this onClick event in javascript that may help
<input id ="btn" type="button" value="Submit"/>
</form>
<script>
document.getElementById('btn').addEventListener('click', function(){validate('firstname', 'spnfirstname');});
</script>
</body
</html>
只需在onClick=Validate中写入函数名,那么,您的错误是什么?请考虑在这个问题上加上错误。