<form>
要素内にinput
がある場合は、フォームにnovalidate
属性を追加するだけで、HTML5検証ツールチップを無効にできます。ただし、入力はフォーム要素ではありません(angularJSを使用しており、ng-form
ディレクティブを使用しています)。
invalid イベントをリッスンして送信検証を防ぐことはできますが、検証ツールチップを防ぐことはできません。
これは簡単な JsFiddle で問題を示しています。
html5
には、入力要素の2つのオプションがあります。
<form>
コンテナに入れます。form
属性を入力に追加します。値は、入力が関連付けられている形式のid
である必要があります。オプション#2を使用すると、DOMのどこかにnovalidate
を含む空のフォームを追加し、そのフォームに入力を添付できます。
<form novalidate>
<p>Input in form with novalidate. This one is fine.</p>
<input type="email" required>
</form>
<p>Input without form. How to disable validation tooltips? (hover over input to see validation tooltip)</p>
<input type="email" required form="novalidatedform">
<form id="novalidatedform" novalidate />
MDN Webサイト のinput
要素に関する詳細情報。
Accepted Answerが機能しますが、これを行うもう1つの方法は、入力要素に「title」属性を追加することです。検証メッセージは、title属性のコンテンツで上書きされます。
タイトル属性に意味のあるテキストを追加できます。
<input type="email" title="Your Email">
P.S HTML5では、HTML 4.01とは異なり、title属性を任意のHTML要素で使用できます。