テキスト ボックスの外側をクリックするまで、テキスト ボックス上の jQuery 変更イベントは発生しないことがわかりました。
HTML:
<input type="text" id="textbox" />
JS:
$("#textbox").change(function() {alert("Change detected!");});
私のアプリケーションでは、テキスト ボックス内の文字が変更されるたびにイベントが発生する必要があります。代わりに keyup を使用することも試みました...
$("#textbox").keyup(function() {alert("Keyup detected!");});
...しかし、右クリックして貼り付けると、キーアップ イベントが発生しないことは既知の事実です。
回避策はありますか? 両方のリスナーがいると、何か問題が発生しますか?
ベストアンサー1
両方のイベントにバインドするのが一般的な方法です。貼り付けイベントにバインドすることもできます。
次のように複数のイベントにバインドできます。
$("#textbox").on('change keyup paste', function() {
console.log('I am pretty sure the text box changed');
});
もっと細かく言うなら、テキストのドラッグに対応するために mouseup にバインドし、lastValueテキストが実際に変更されたことを確認するための変数を追加する必要があります。
var lastValue = '';
$("#textbox").on('change keyup paste mouseup', function() {
if ($(this).val() != lastValue) {
lastValue = $(this).val();
console.log('The text box really changed this time');
}
});
さらに、細かいことを気にするならsuper duper、自動入力やプラグインなどに対応するためにインターバル タイマーを使用する必要があります。
var lastValue = '';
setInterval(function() {
if ($("#textbox").val() != lastValue) {
lastValue = $("#textbox").val();
console.log('I am definitely sure the text box realy realy changed this time');
}
}, 500);