背景: 私たちの Web アプリは jquery.constrain.js プラグインを使用して、一部のテキスト ボックスのデータ入力を処理し、有効な文字のみを追加できるようにします。このプラグインは、正規表現、ホワイトリスト/ブラックリスト文字などを使用して、データに対するさまざまな制約を許可します。今日まで、このプラグインの 1.0 リリースを変更せずに実行していました。
数日前、一部のテキスト ボックスで無効なデータ入力が許可されていることに気付きました。たとえば、数値のみのテキスト ボックスでは英字などを使用できました。また、「オブジェクトはこのプロパティまたはメソッドをサポートしていません」という JavaScript エラーも表示されました。jquery.constrain プラグインの次の関数まで追跡しました。
function match(item, input, e) {
var arr = item.chars.split("");
for (var i in arr) {
var token = arr[i];
if (token.charCodeAt(0) == e.which) {
return true;
}
}
if (item.regex) {
var re = new RegExp(item.regex);
if (re.test(String.fromCharCode(e.which))) {
return true;
}
}
return false;
};
このコード ブロックをデバッグして、次のことを確認しました。
- itemは、 charsとregexの 2 つの文字列プロパティを持つオブジェクトです。
- item.charsは失敗時の空文字列 ("") です。
- arr、item.chars.split("")の結果は、予想どおり、空の配列です。
ここがおかしいところです。arrは空の配列ですが、 for ループは有効な値をiに割り当てます。値は「削除」です。というわけで、ループに入ります。 arr["remove"] が null であるため、tokenは明らかに null です。したがって、token.charCodeAt(0)がスローされます。
次のように、for ループの周りに if ステートメントを追加して、エラーを修正しました。
if (arr.length > 0) {
for (var i in arr) {
var token = arr[i];
if (token.charCodeAt(0) == e.which) {
return true;
}
}
}
しかし、なぜこれが必要だったのか完全に困惑しています。これは IE のバグなのか、プラグインのバグなのか、それともアプリをコンパイルするときに息を止めているだけなのでしょうか?