web-dev-qa-db-ja.com

Safariは「必須」属性を認識していません。修正方法

<form id="customerForm">
    <label>
        First Name:
        <input id="firstName" required />
    </label>
    <label>
        Social Security Number:
        <input id="ssn" required pattern="^d{3}-d{2}-d{4}$"
            title="Expected pattern is ###-##-####" />
    </label>
    <input type="submit" />
</form>

そのドキュメントをChromeで試すと、条件を受け入れ、期待どおりにエラーを表示します。

しかし、Safariでそのドキュメントを試しても、エラーは表示されません。

html5google-chromesafarirequired
15
Amir Bennasr

現時点では、Safariは「必須」入力属性をサポートしていません。 http://caniuse.com/#search=required

Safariで「必須」属性を使用するには、「 webshim 」を使用できます。

1-webshimのダウンロード

2-このコードを入れてください：

<head>
    <script src="js/jquery.js"></script>

    <script src="js-webshim/minified/polyfiller.js"></script> 

    <script> 
        webshim.activeLang('en');
        webshims.polyfill('forms');
        webshims.cfg.no$Switch = true;
    </script>
</head>
25
Jérémie Chazelle

現在、Safariは、ユーザーが入力していないフォームフィールドの必須値（またはユーザーがフォームフィールドに入力した無効な値）のエラーメッセージをまだ出力していません。ただし、ハックまたはポリフィルを使用して有効にすることができます。 HTML5フォーム検証フォールバック（ライブラリなし） を有効にする軽量ハックを参照してください。 h5Validate をjQueryベースのポリフィルプラグインを参照してください。

7
sideshowbarker

必須の属性は、 Safari 10.1以降 で利用できるはずです。

0
bfulgham