Question

我正在使用这个工具： https://www.edq.com/real-time-email-validation/

...验证电子邮件地址是否确实存在。

此工具正常工作，但即使验证失败，用户仍可以提交表单。我需要添加什么来代码，如果用户输入的电子邮件地址不起作用，则不允许用户提交表单？

执行验证的代码段：

<script type="text/javascript">

        var $plugin = new emailValidation(              
          $( "#email"), {
            token: "[hidden]",
            proxyPath:  "[hidden]",
            featureVersion:  "1.0" ,
            timeout: 10000,
            inlineMode: true,
            showLoading: true,
            onSuccess: function (data) {
            // onSuccess callback implementation
            },
            onError: function (jqXHR, status, errThrown) {

            },
            messages: {
                emptyEmail:  "Please enter email.",
                error:  "Please contact Experian QAS support.",
                timeout:  "Timeout.",
                success: "yay!"
            },
            styles: {
                success: "success",
                successInline: "success-inline",
                error: "error",
                errorInline: "error-inline",
                loading: "loading",
                correctionEmail: "correctionEmail",
                emailPicklistHeader: "emailPicklistHeader",
                emailPicklist: "emailPicklist",
                picklistItem: "picklistItem",
                picklistItemText: "picklistItemText",
                closeButton: "closeButton",
            }
          }
      );


        </script>

Answer 1

密钥位于窗口小部件事件中：onSuccess和onError。使用它们可以通过多种方式实现，例如：

禁用提交按钮：

onSuccess: function (data) {
    $('#mySubmit').prop("disabled", null);
},
onError: function (jqXHR, status, errThrown) {
    $('#mySubmit').prop("disabled", "disabled");
}

阻止表单提交：

onSuccess: function (data) {
    $('#myForm').data("email-ok", true);
},
onError: function (jqXHR, status, errThrown) {
    $('#myForm').data("email-ok", false);
}

// On form
$("#myForm").on("submit", function(e) {
    if (!$(this).data("email-ok")) {
        e.preventDefault();
        // show an error message 
    }
});

在这两种情况下，您都必须等待服务的响应，然后管理您的表单。我认为选项＃2更好，但＃1也没问题。

防止表单提交无效的电子邮件地址

1 个答案: