element.setCustomValidity 似乎不起作用

Posted 2023-05-09

【中文标题】element.setCustomValidity 似乎不起作用

【英文标题】：element.setCustomValidity does not seem to work

【发布时间】：2016-02-01 01:52:18

【问题描述】：

我在电子邮件字段上有一个更改事件，该事件应该使用 ajax 调用来验证电子邮件地址是否唯一。问题是它告诉我该元素不支持 setCustomValidity 方法。请帮忙。

$("#tbEmail").change(function (event) 
    var obj = new Object();

    obj.email = $("#tbEmail").val();
    var params = JSON.stringify(obj);

    $.ajax
    (
        
            type: "POST",
            url: "./controllers/Consumer.aspx/validateEmail",
            data: params,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (result) 
                if (result.d != 0) 

                    var element = $("#tbEmail");
                    element.setCustomValidity('The email address entered is already registerd.');
                    alert(element.checkValidity());
                    alert(element.validationMessage);
                
                else 
                    $("#tbEmail").setCustomValidity("");
                ;
            ,
            error: function (result)  ProcessError(result) 
        
    );

)

【参考方案1】：

setCustomValidity 是 DOM API 而不是 jQuery API。在您的代码中，您试图在 jQuery 实例上调用它。所以你需要先获取 DOM 元素实例，然后调用 API。

还需要兼容 html5 的浏览器和表单。

 var element = $("#tbEmail")[0];
 element.setCustomValidity('The email address entered is already registerd.');

【讨论】：

成功了！非常感谢vinayakj。我会玩好几天，没想到这一点。我如何接受答案？我是 *** 的新手。

或者你可以做document.getElementById('tbEmail').setCustomValidity('输入的电子邮件地址已经注册。');

【参考方案2】：

一个更简单的方法，添加“[0]”：

$("#tbEmail")[0].setCustomValidity("")

【参考方案3】：

使用get(0)。

    var element = $("#tbEmail").get(0);
    element.setCustomValidity('The email address entered is already registerd.');

【参考方案4】：

$("#tbEmail").setCustomValidity("错误信息")

【讨论】：

虽然此代码 sn-p 可能是解决方案，但 including an explanation 确实有助于提高您的帖子质量。请记住，您是在为将来的读者回答问题，而这些人可能不知道您提出代码建议的原因。

否决票：第一：没有解释，第二：这是错误的。它与提问者有同样的失败。我希望没有人会读到这篇文章。