javascript - 检查表单提交时的空字段

Question

我已经创建了一个 eshop。我已经为“数量”输入了一个输入字段，当我点击提交按钮时，产品将被添加到我的购物篮中。但是，如果我在数量字段为空的情况下按下提交按钮，它会将我重定向到一个空页面。

所以我想在表单提交中附加一个事件，这样如果数量字段为空，则什么都不做。

javascript中的新功能，在此先感谢！

score 6 · Accepted Answer

document.getElementById("formId").onsubmit = function () {
    if (!document.getElementById("myField").value) {
        return false;
    }
}

这将捕获表单的提交操作并验证给定字段是否为空。返回 false 会中断表单提交。这也可以通过将事件参数传递给函数然后使用e.preventDefault().

score 3 · Accepted Answer

现在是 2017 年和 Html 5，我相信您已经发现：

<input name="quantity" required>

给你想要的。甚至可能：

<input name="quantity" type="number" min="1" required>

请注意，这里的所有答案都仅在客户端进行检查。您还必须在服务器上检查或处理空值。如果一个空值（您认为永远不会提交）使您的服务器应用程序崩溃，黑客可以使用它来探测漏洞。

score 1 · Accepted Answer

如果输入框为空，此代码不会让您的表单提交；

<input type="submit" onclick="return checkEmpty()">

别忘了放在return前面checkEmpty()

JS

function checkEmpty() {
var valueofId=document.getElementById("myField").value;
if (!valueofId) {
        return false;
    }
}

score 0 · Accepted Answer

在提交表单时，执行一个 javascript 方法来检查是否使用 document.getElementById('').value 在字段中输入了值。如果没有返回值。

前任：

var x=document.getElementById('<your_id>').value;
if (x==null || x=="")
  {
    return false;
// redirect to where you want
  }

高温高压

4 回答 4