如何检查不包含提交按钮的HTML5表单的有效性？

I have the following code example that works in browsers that check when they see the HTML5 "required" on an input like the email here:

我有以下代码示例在浏览器中工作，检查他们何时在输入上看到HTML5“required”，如此处的电子邮件：

<form id='myForm'>
    <div>
    <label>Email:
      <input name=email type=email required title="enter your email">
    </label>
    <input type=submit>
    </div>
</form>

Here is a fiddle for the above.

这是上面的小提琴。

However in my application I use a button outside of my form and the following code attached to the click event of that button:

但是在我的应用程序中，我在表单外部使用了一个按钮，以下代码附加到该按钮的click事件：

if (!$form.valid || $form.valid()) {
    $submitBt
        .disableBt();
    $modal
        .removeBlockMessages()
        .blockMessage('Contacting Server, please wait ... ', {
            type: 'loading'
        });
    $.ajax({
        url: href,
        dataType: 'json',
        type: 'POST',
        data: $form.serializeArray()
    })
        .done(onDone)
        .fail(onFail);
}

I have two questions here:

我这里有两个问题：

What does the following code do: (!$form.valid || $form.valid())
以下代码的作用是什么：（！$ form.valid || $ form.valid（））
How can I check my form validity using the new HTML5 checks?
如何使用新的HTML5检查检查表单有效性？

2 个解决方案

#1

Assuming that you have set the form element to an object called $form, then if (!$form.valid || $form.valid()) is clever syntax that means "if $form doesn't have a method called valid, or if valid() returns true". Typically you will have installed and initialized the jQuery Validation plugin by then, but this prevents the form from becoming disabled if the validation plugin is not loaded.

假设你已经将form元素设置为一个名为$ form的对象，那么if（！$ form.valid || $ form.valid（））是巧妙的语法，意思是“如果$ form没有一个名为valid的方法，或者如果valid（）返回true“。通常，您将在那时安装并初始化jQuery Validation插件，但是如果未加载验证插件，这将阻止表单被禁用。

You can do a similar test using the HTML5 method checkValidity, looking something like this:

你可以使用HTML5方法checkValidity进行类似的测试，看起来像这样：

if (!$form.checkValidity || $form.checkValidity()) {
  /* submit the form */
}

EDIT: checkValidity is a function from the HTML5 forms spec. As of February 2016 CanIUse.com reports that over 95% of browsers support it.

编辑：checkValidity是HTML5表单规范中的一个函数。截至2016年2月，CanIUse.com报告称超过95％的浏览器都支持它。

2 个解决方案

#1

更多相关文章

随机推荐