2017-02-07 4 views
0

AMPフォームでは、HTML5フォームの検証を使用してユーザーの入力を検証することしかできません。デスクトップChromeブラウザでうまく動作します。しかしSafariは今までHTML5形式の検証をサポートできませんでした。解決策を見つけたので、Safariブラウザでフォームの検証を実装するためには外部のJavascriptが必要です。しかし私の場合、AMPは私にそうすることを許しません。SafariのAMPフォームの検証

SafariのHTML5検証入力をバイパスするためのハックやトリックはありますか?

答えて

1

AMPドキュメントをAMP by Example amp-form demoと比較してみてください。 amp-form拡張機能は、ネイティブ検証をサポートしていないブラウザ用のフォーム検証APIポリフィルを実装しています。ネイティブサポートなしでSafariバージョンでamp-formを使用している場合、ポリフィル動作は自動的に実行されます。

ポリフィル検証は次のようになります。 An example of the amp-form polyfill validation UI. There is a text bubble saying "value missing" pointing to a text field labeled "Name..." above a "Subscribe" button.

0

それは、このHTML5 documentationで言及されました:Safariはこれを書いて(バージョン6)のように、制約バリデーションAPIをサポートしていますが、Safariは、制約の検証の問題にフォームの送信を防ぐことはできません

これを回避する最も簡単な方法は、上記の回避策と同じ方法を使用して、すべてのフォームにnovalidate属性を与え、preventDefaultを使用してフォームの送信を手動で防止します。これにより

は、あなたはそれがまた、Forms should respect the novalidate attributeなどを追跡する問題をAMPフォームのサポートに関するガイドラインを提供し、ここでこのthreadをチェックすることもできます。与えられたコードhereを見て、それがあなたを助けるのを見てください。