Question

很抱歉，如果这个问题的布局不正确（我第一次使用堆栈溢出）。我正在尝试验证是否在用户按下“提交”时填写了我在表单上的输入，当输入为空时，它还会提醒用户，但在输入为空时，它会提醒用户，我不确定出了什么问题。这是我的Javascript：

<script>
   function validation() {
     var x = document.forms["bookingForm"]["id"].value;
     if (x == "") {
       alert("Ensure all fileds are filled");
       return false;
     } else {
       sendSMS();
       alert("Success");
       return true;
     }
      }
</script>

这里是指向代码扩展部分的链接，以供参考：https://pastebin.com/Dj5fA3gB

Answer 1

如果您使用的是SubmitButton，并且正在表单的onSubmit上调用验证，那么您需要调用event.preventDefault（）;

<!DOCTYPE html>
<html>
<body>

<form onsubmit="validation()" name="bookingForm">
  First Name: <input type="text" name="id" value="Donald"><br>
  Last Name: <input type="text" name="lname" value="Duck">
  <input type="submit" value="Submit" />
</form>

<script>
function validation() {
	 event.preventDefault();
         var x = document.forms["bookingForm"]["id"].value;
         if (x == "") {
           alert("Ensure all fileds are filled");
           return false;
         } else {
           sendSMS();
           alert("Success");
           return true;
         }
      }
</script>

</body>
</html>

Answer 2

访问表单元素和元素值的常规语法为：

document.forms[number].elements[number]


document.forms[number].elements[number].value

Answer 3

正如我的评论所建议的，最干净的解决方案是通过将html属性添加到您的输入中来使用它。

看起来像这样。

<form>
 <input type="text" name="example" required>
 <input type="submit" name="send">
</form>

最大的优点是，它不需要任何额外的JS就可以工作，我认为这始终是首选的解决方案。

Answer 4

您没有在form标记中包含return关键字，而没有在form标记中添加不必要的关键字“ name”。

<form onsubmit="return validation()" method="POST"
                    action="">

从表单标记中删除“名称”属性，然后添加操作属性。在action属性的括号内，提及验证成功后会发生什么例如：（此代码可帮助您了解“操作”属性）

<form onsubmit="return productsvalidationform();" method="POST"
                    action="AddProductServlet">

成功验证表单后，我将其定向到AddProductServlet。（AddProductServlet是JSP Servlet）。以便提及您需要重定向到的位置。

无法获得输入验证Javascript

4 个答案: