Javascript 试图用错误消息验证我的表单,似乎不起作用

Javascript 试图用错误消息验证我的表单,似乎不起作用,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"; } }

我想用相同的函数传入不同的元素ID

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 1.-使用“值”属性从输入中获取实际值:

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中写入函数名,那么,您的错误是什么?请考虑在这个问题上加上错误。