2つのオブジェクトを初期化しましたが、サイズを変更すると(各オブジェクト名を書き込む関数がトリガーされます)、最後のオブジェクトのみが書き込まれます。
jQueryからバニラJavascriptの記述に切り替えたばかりなので、コードが意味をなさない、何かが足りない、またはまったく間違っている場合は、お知らせください。私は批判を歓迎するだけでなく、正しい方法を学びたいと思っています。
とにかく、なぜそれが2番目/最後のオブジェクトだけを返すのかを理解する助けはありますか?CodePen https://codepen.io/kmarmet/pen/NYQvWV?editors=1011
コード
const Obj = function(options) {
const cont = document.querySelector('.cont');
const obj = options.objClass;
let delay = function() {};
const whenDone = () => cont.innerHTML += `${obj}<br>`;
return window.onresize = () => {
clearTimeout(delay);
return delay = setTimeout(whenDone, 100);
};
};
const one = new Obj({
sliderClass: 'slider-1'
});
const two = new Obj({
objClass: 'slider-2'
});
ありがとう!
を介して割り当てることができるイベントハンドラは1つだけwindow.onresize
です。addEventListener
代わりに使用してください:
window.addEventListener('resize', () => {
clearTimeout(delay);
delay = setTimeout(whenDone, 100);
});
さらに、コンストラクターから何かを返すことも、resize
イベントリスナーから返すこともあまり意味がありません。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加