时间戳

首页 > 解决方案 > 如何判断表单是否有效并根据是否有效显示弹出窗口？

javascript - 如何判断表单是否有效并根据是否有效显示弹出窗口？

问题描述

我正在尝试创建一个用户填写其详细信息的表单，如果其中一个字段没有输入，则该表单当前不会发送，因为我已在每个标签中添加了“必需”以创建场地。如果表单有效但它不起作用，我已经编写了一些 JavaScript 来打开一个弹出窗口，表单提交到我的 PHP 数据库但没有出现弹出窗口。有什么想法吗？这是我当前的 JavaScript。

表单字段的代码 -

label for="fname">First Name</label>
    <input type="text" id="fname" name="firstname" placeholder="Your name..." required>
    <label for="lname">Last Name</label>
    <input type="text" id="lname" name="lastname" placeholder="Your last name..." required>
    <label for="phonenumber">Phone Number</label>
    <input type="text" id="phonenumber" name="phonenumber" placeholder="The best number to contact you on..." required>

调用脚本的代码 -

<button onclick="myFunction()">Submit</button>

JavaScript 验证

<script>

function validateForm() {
var x = document.forms["fname"].value;
var y = document.forms["lname"].value;
var p = document.forms["phonenumber"].value;
if ([x == "", y =="", p ==""]); {
 alert("Name must be filled out");
 return false;
}
} 

function myFunction() {

if (x == "") {
return false;
}
else {
alert("Thank you for making an enquiry, a member of our team will be in contact with you soon.");
}
}

标签： javascript

解决方案

试试下面的代码 

<script>

function validateForm() {
var x = document.forms["Forms"]["fname"].value;
var y = document.forms["Forms"]["lname"].value;
var p = document.forms["Forms"]["phonenumber"].value;
if (x == "" && y =="" && p ==""); {
 alert("Name must be filled out");
 return false;
}
else
{
return true ;
}
} 


<form name="Forms" onSubmit="return validateForm() "><input type="text" name="fname" /><input type="text" name="lname" /><input type="text" name="phonenumber" /></form>

或者您可以简单地在每个输入中使用required

推荐阅读