设置为在 Safari 中工作的 HTML5 的 JavaScript 必填字段答案

【问题标题】：JavaScript for HTML5 required field set up to work in Safari设置为在 Safari 中工作的 HTML5 的 JavaScript 必填字段
【发布时间】：2013-11-05 23:50:15
【问题描述】：

我正在使用以下脚本来更改我的 input 元素的 HTML5 required 属性。我想知道是否有办法修改此脚本以使其也适用于 Safari 浏览器，因为 Safari 不支持此属性。

这是脚本：

$(document).ready(function() {
    $_POST = array();
    var elements = document.getElementsByTagName("INPUT");
    for (var i = 0; i < elements.length; i++) {
        elements[i].oninvalid = function(e) {
            e.target.setCustomValidity("");
            if (!e.target.validity.valid) {
                e.target.setCustomValidity("This field can't be blank");

            }
        };
        elements[i].oninput = function(e) {
            e.target.setCustomValidity("");

        };
    }
})

【问题讨论】：

这是什么$_POST = array()？看起来不太对...
这是另一个目的，与整体没有任何关系。我会将其从问题中删除。
Safari is not acknowledging the "required" attribute. How to fix it?的可能重复

标签： javascript php jquery html

【解决方案1】：

你也可以这样做：

var valid = true;
$('input[required]').each(function() {
    if (this.value == '') {
        // Alert or message to let them know
        valid = false;
        return false; // stop on first error, or remove this and it'll go through all of them.
    }
});

if (valid === false) {
    return false;
}

【讨论】：

【解决方案2】：

您将需要在提交表单时使用事件处理程序自行运行检查。在该处理程序中，您自己运行检查，如果检查失败，您将显示任何错误消息并使用preventDefault 或return false 阻止提交。

An example can be found here，但正如它所指出的，如果您使用 checkValidity 作为检查表单的方法，您需要小心。

【讨论】：

【解决方案3】：

在此处查看此页面。它包含一个 hacky 解决方案，应该添加所需的功能

http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/#toc-safari

【讨论】：