HTML5 入力要素 (またはサポートされていないポリフィル) のカスタム妥当性ルールを作成したいと考えています。ブラウザのネイティブ検証手順に可能な限り溶け込むために、入力要素のcheckValidity
メソッドを上書きしてロジックをフックすることにしました。
/* input_element is the DOM element to enhance: */
var original_check = input_element.checkValidity.bind(input_element);
input_element.checkValidity = function() {
var original_validity = original_check();
/* run our own check only, if the original check went well */
if (original_validity && ! custom_validity_checker(input_element)) {
trigger_event('invalid', input_element);
return false;
}
return original_validity;
};
このアプローチには、私が予想していなかった問題はありますか?
私が知る限り、有効性チェック関数が積み重ねられて次々に呼び出されるため、このソリューションは複数回呼び出されることに対して堅牢です。
しかしcheckValidity()
、ネイティブメソッドではないことが私を苦しめる他のケースがあるでしょうか?