javascript - 表单未得到验证

标签 javascript css html

我有这段代码,但是,它没有验证表单...

请注意,这不是整个页面,只是一个片段。代码应该验证不同的标签,但我不想用 html 属性来验证。它需要在 JavaScript 中完成...

我的编码哪里出了问题?

//To disable the radio buttons
function disableStuffNo(){
    //random comment to post
    document.getElementById("tele").disabled = false;
    document.getElementById("whatsapp").disabled = false;
    //random comment to post
    document.getElementById("call").disabled = false;
    document.getElementById("email").disabled = false;
}

 function disableStuffYes(){
    document.getElementById("tele").disabled = true;
     //random comment to post
    document.getElementById("whatsapp").disabled = true;
    document.getElementById("call").disabled = true;
    //random comment to post
    document.getElementById("email").disabled = true;
}

//To validate the form
function validateForm() {
    var a = document.forms["Order"]["Fname"].value;
    var b = document.forms["Order"]["Lname"].value;
    var c = document.forms["Order"]["topic"].value;

    if (a == ""||b == ""||c == "") {
    alert("Everything must be filled out");
    return false;
}      

HTML:

<form name="Order" style="margin-left: auto;margin-right: auto;display:block;" onsubmit="validateForm()">
    <fieldset>
        <!--random comment so i can post-->
        First Name: <input type="text" id="Fname" maxlength="40"<br/><br/>
        Last Name: <input type="text" id="Lname"  maxlength="40"><br/><br/>
        <!--random comment so i can post-->
        Occasion: <input type="text" id="topic"  max="50"><br/><br/>
        Gender:<br/>
        Female <input type="radio" id="female" name="gender" value="Female">
        <!--random comment so i can post-->
        Male <input type="radio" id="male" name="gender" value="Male"><br/>
        <!--random comment so i can post-->
        You do wish to schedule an appointment to discuss further? 
        Yes <input type="radio" id="yes" name="answer" value="Yes" checked onclick="disableStuffYes">
        <!--random comment so i can post-->
        No <input type="radio" id="no" name="answer" value="No"onclick="disableStuffNo;"><br/>
        Telephone Number: <input type="text" id="tele" maxlength="20" value="1(876)"><br/>
        Through:<br/>
        <!--random comment so i can post-->
        Whatsapp <input type="radio" id="whatsapp" name="choice" value="Whatsapp">
        Call <input type="radio" id="call" name="choice" value="Call">
         <!--random comment so i can post-->
        Email <input type="radio" id="email" name="choice" value="Email">
        <br/>
        <br/><br/>
    </fieldset>
    <fieldset>
        <!--random comment so i can post-->
        Please indicate the details of your request :)<br/>
        <textarea maxlength="1500" rows="20" cols="100">
        </textarea><br/>
         <!--random comment so i can post-->
        <input type="submit" value="Submit">
    </fieldset>
</form>

最佳答案

它实际上对我来说没有任何问题。我只是复制/粘贴代码并且它起作用了。 我的建议如下:

1) 尝试在关闭 body 标签之前将 javascript 代码直接包含在您的 html 中

<script>
//To validate the form
function validateForm() {
  var a = document.forms["Order"]["Fname"].value;
  var b = document.forms["Order"]["Lname"].value;
  var c = document.forms["Order"]["topic"].value;

  if (a == "" || b == "" || c == "") {
     alert("Everything must be filled out");
     return false;
  }  
 }
 </script>

2) 如果有效,请检查外部 javascript 文件的链接是否正确。您可以通过检查元素并检查控制台是否有 404 错误(“找不到 file.js”)来做到这一点。

因为它对我有用,所以我真的不认为这是一个代码错误,很可能会变成选项 2。

关于javascript - 表单未得到验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54714476/

相关文章:

javascript - 从更改数组中获取静态值

html - Django 无法正确呈现 CSS

javascript - 使用用户输入更改宽度大小时出现问题

java - 从 html 页面和 javascript 调用 java webservice

javascript - 为什么不使用each()创建多个标签?

javascript - js 正则表达式 - 检查数字并可选择以/结尾

Javascript/NodeJS/Express 范围混淆

javascript - 如果 POST 路由使用 RegEx,我应该为 HTML 表单设置什么操作属性?

css - 在 Twitter Bootstrap CSS 中覆盖 `background: transparent !important`

javascript - 连接/拼接 Web 图像资源以缩短加载时间