Question

在我的表单中，用户必须输入4个值才能生成乘法表。

为了验证用户的输入，我使用jQuery。如果输入无效（空白，非整数等），则显示错误消息。仅当输入有效时，“提交”按钮才起作用。

我用它来防止表单提交（来源：Preventing a form from submitting in jQuery Validate plugin's submitHandler function）：

$("#inputForm").submit(function(generateTable) {
   generateTable.preventDefault();
}).validate({
   //code
});

这是validate.js文件：

function generateTable() {
   //code
   return false;
}

$(function() {
   $("#inputForm").submit(function(e) {
      e.preventDefault();
   }).validate({
      //rules
      //messages
});

这是HTML文件：

<form id="inputForm" class = 'card p-3 bg-light' class="form-horizontal" onsubmit="return generateTable();">

问题在于，即使输入无效，也正在提交表单。如何阻止表单提交？

Answer 1

您不需要调用Submit函数，只需使用以下内容即可。

$("#inputForm").validate({
    rules: {
        "name": {
            required: true,
            minlength: 5
        },
        "email": {
            required: true,
            email: true
        }
    },
    messages: {
        "name": {
            required: "Please, enter a name"
        },
        "email": {
            required: "Please, enter an email",
            email: "Email is invalid"
        }
    },
    submitHandler: function (form) { // for demo
        alert('valid form submitted'); // for demo
        return false; // for demo
    }
});

See this fiddle here

阻止表单提交jQuery

1 个答案: