TIL-68 Javascriptエスケープとドラッグ&ドロップ
5487 ワード
ジャンプ
連続呼び出しの関数の最後(または最初)のみが呼び出されます.
代表的なajax検索でよく使われます.<input id="input" />
document.querySelector('#input').addEventListener('input', function(e) {
console.log('ajax 요청', e.target.value);
});
たとえば、このような論理があると言ったら、コンソールが1つずつ見えます.その言葉の意味は、押すたびに通信を要求することです.このような場合、不要なサーバコストが発生します.その時は滴丸でいいです.let timer;
document.querySelector('#input').addEventListener('input', function(e) {
if (timer) {
clearTimeout(timer);
}
timer = setTimeout(function() {
console.log('ajax 요청', e.target.value);
}, 200);
});
200ミリ秒以内に入力がない場合は、入力として終了します.
書き込み(Throttling)
最後の関数を呼び出してからしばらくしてから再度呼び出さないでください.
回転は通常、上下にスクロールするために使用されます.
上下にスクロールすると、スクロールイベントが多く発生します.
数秒に1回、または数ミリ秒に1回の実行を制限するだけです.let timer;
document.querySelector('#input').addEventListener('input', function (e) {
if (!timer) {
timer = setTimeout(function() {
timer = null;
console.log('ajax 요청', e.target.value);
}, 200);
}
});
ソース:https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794fa
Reference
この問題について(TIL-68 Javascriptエスケープとドラッグ&ドロップ), 我々は、より多くの情報をここで見つけました
https://velog.io/@ssxst31/Javascript-디바운싱과-쓰로틀링
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
<input id="input" />
document.querySelector('#input').addEventListener('input', function(e) {
console.log('ajax 요청', e.target.value);
});
let timer;
document.querySelector('#input').addEventListener('input', function(e) {
if (timer) {
clearTimeout(timer);
}
timer = setTimeout(function() {
console.log('ajax 요청', e.target.value);
}, 200);
});
最後の関数を呼び出してからしばらくしてから再度呼び出さないでください.
回転は通常、上下にスクロールするために使用されます.
上下にスクロールすると、スクロールイベントが多く発生します.
数秒に1回、または数ミリ秒に1回の実行を制限するだけです.
let timer;
document.querySelector('#input').addEventListener('input', function (e) {
if (!timer) {
timer = setTimeout(function() {
timer = null;
console.log('ajax 요청', e.target.value);
}, 200);
}
});
ソース:https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794faReference
この問題について(TIL-68 Javascriptエスケープとドラッグ&ドロップ), 我々は、より多くの情報をここで見つけました https://velog.io/@ssxst31/Javascript-디바운싱과-쓰로틀링テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol