0

我想手动显示 html 5 验证消息（即通过代码）。据我了解，没有直接的方法来调用此消息。但是，我们可以通过单击提交按钮来实现。

当您单击 html 正文时，我尝试带上验证消息（如果该字段无效）：

// if url is invalid, display the error message.
if(!$('#theurl')[0].checkValidity()){

    console.log('Button Click');
    $('#btn').click();

}

这是相同的jsfiddle。不幸的是，上面的代码正在崩溃。我不知道为什么。相反，如果您手动单击虚假按钮，它可以正常工作。

请帮我完成这个。

4

3 回答 3

4

问题是您的 Click 函数使用参数“e”，但您正在寻找参数“事件”。 

$('body').click(function(e){

通话

    $(event.target)

将其更改为“e.target”，它可以工作：

http://jsfiddle.net/wLCdz/3/

此外，该checkValidity函数是从表单调用的，而不是从表单中的各个项目调用的。因此，如果您像这样调用 checkValidity 函数：

document.forms[0].checkValidity()

由于这个原因，它将停止崩溃。

于 2013-08-23T12:25:11.453 回答
0

在您的 jsfiddle 中，第 22 行的代码导致无限循环，最终导致脚本崩溃：

$('#btn').click();

如果您注释掉该行，它将不再崩溃。像您正在做的那样触发对按钮的点击也会导致在 body 元素上触发另一次点击。

要明白我的意思，请注释掉该行，在表单中输入一个错误的 url，然后单击正文。每次单击都会向控制台写入一条消息。

于 2013-08-23T12:29:16.327 回答
-1

尝试这个：

<form id="formId">
...
</form>

$('body').click(function(e){

    // ignore, if clicked on the url
    if ($(event.target).closest('#theurl').length) {
        return;
    }

    // ignore, if clicked on the email
    if ($(event.target).closest('#theemail').length) {
        return;
    }

    // ignore, if clicked on the button
    if ($(event.target).closest('#btn').length) {
        return;
    }

    // if url is invalid, display the error message.
    if(!$('#formId')[0].theurl.checkValidity()){

        console.log('Button Click');
        $('#btn').click();

    }

});
于 2013-08-23T12:28:20.747 回答