jQuery表单验证。如何防止多次出现错误消息

Question

我正在尝试在jQuery中验证表单。我有它的工作，有1个问题。如果我单击两次“提交”按钮，错误消息将显示两次，堆叠在彼此的顶部。

EG

名称不能为空

名称不能为空

//Form Validation

//Store checkbox, and checkbox label in jQuery object
 $terms = $('#terms');
 $termsdoc = $('#terms-doc');

//Check if pet name is empty
if($name.val() == '')
{
    $name.after('<p class="error">Name must not be empty</p>')
}


if($terms.is(':not(:checked)'))
{
    $termsdoc.after('<p class="error">Please agree to the terms and conditions</p>')
}

Answer 1

使用.last()只会将所需内容添加为目标选择的最后一个子项，因此您所看到的是添加的重复元素。

解：

您可以使用类＆＃34;错误＆＃34;定位<p>标记之前删除它们，然后使用.last()添加：

$("p.error").remove();

Answer 2

您还可以在处理程序中禁用提交按钮。 $(".submit").prop("disabled",true); 这样可以防止重复提交。