Javascript 验证表单是否已完全提交

我有一个学校作业，他们让我用HTML和Javascript创建一个比萨饼表单。 他们要求输入三个字段——大小、姓名和地址

如果其中一个字段为空，则会弹出一条警告消息，提示 缺少什么

如果表单有效且完整，则应弹出一条警告消息，说明全名、地址和大小 我的问题是我不明白如何检查表格是否已满

这是我到目前为止写的代码：

函数validateForm（）{
var errormessage=“”；
if（document.getElementById（'name'）。值==“”）{
警报（errormessage+=“请输入您的姓名”）
返回false；
}
if（document.getElementById（'address'）。值==“”）{
警报（errormessage+=“请输入您的地址”）
返回false；
}
}
警报（“通过验证”）；
返回true；
}

页面标题
比萨饼订单
全名：



地址：



大小：

大的
中等
小的

按照您尝试执行此操作的方式，您的表单提交正在调用

fullForm（）

因此，将javascript更改为：

    function fullForm() {
        var errormessage = "";

        if (document.getElementById('name').value == "") {
        alert (errormessage += 'Please enter your name')
        return false;
        }

        if (document.getElementById('address').value == "") {
            alert (errormessage += 'Please enter your address')
            return false;
        }

    alert("validations passed");



    return true;
}

添加

else if

条件和

else

条件以提交有效表单

更新代码：

<form id="pizza-form" onsubmit="return validateForm()" method="post">

函数validateForm（）{
var errormessage=“”；
if（document.getElementById（'name'）。值==“”）{
警报（errormessage+=“请输入您的姓名”）；
返回false；
}else if（document.getElementById（'address'）。值==“”）{
警报（errormessage+=“请输入您的地址”）
返回false；
}否则{
返回true；
}
}

页面标题
比萨饼订单
全名：




地址:




尺寸：


大的
中等
小的

您已接近解决方案。在HTML代码中，更正

onsubmit

函数的名称，并在javascript函数中一起检查所有值：

函数validateForm（）
{
var errorMessage=''；
var nameValue=document.getElementById（'name'）.value；
var addressValue=document.getElementById（'address'）.value；
如果（！nameValue）
errorMessage+='请输入您的姓名\n'；
如果（！addressValue）
errorMessage+='请输入您的地址'；
如果（错误消息）
{
警报（错误消息）；
返回false；
}
其他的
{
警报（'Name:'+nameValue+'\n'+'地址：'+addressValue）；
返回true；
}
}

比萨饼订单
全名：



地址：



大小：

大的
中等
小的

优化的解决方案如下所示：

函数validateForm（）{
常量errorTable=['name'，'address']
const errorMessage=errorTable.map（elem=>！！document.getElementById（elem）.value？“”：“请输入您的”+elem）
console.log（errorMessage.join（'\n'））
返回errorMessage.every（elem=>elem==''）
}

页面标题
比萨饼订单
全名：



地址：



大小：

大的
中等
小的

我的问题是，我不明白如何检查表单是否已满-->您所说的

已满是什么意思？您实际上不需要检查每个字段是否已填写。检查每个输入字段是否为空。那很好，很有效。因此，如果某个字段为空，则给出错误消息。这也行。在你的功能结束时，你给出一个警告，说一切都很好，填写正确。只有在之前的两个检查没有因为某些输入字段没有填写而停止函数执行时，才能达到这一点。因此，如果每个字段都已填写，则末尾的警报会告诉用户表单已正确填写。不需要额外检查。嗨@Guy Sidon，有答案帮你吗？如果是的话，你能把它标记为接受吗？谢谢
function validateForm() {
 var errormessage = "";
 if (document.getElementById('name').value == "") {
  alert(errormessage += 'Please enter your name');
  return false;
 } else if (document.getElementById('address').value == "") {
  alert(errormessage += 'Please enter your address')
  return false;
 } else {
  return true;
 }
}