A magic box with some minor functions
npm install js-magic-box防抖示例
// 1. 定义需要防抖处理的函数
function handleInput(value) {
console.log('处理输入内容:', value);
}
// 2. 创建防抖函数(延迟500ms执行)
const debouncedHandle = eventBox.debounce(handleInput, 500);
// 3. 绑定到输入事件
const input = document.getElementById('username');
input.addEventListener('input', (e) => {
debouncedHandle(e.target.value);
});
// 4. 手动取消防抖(可选)
// debouncedHandle.cancel();
节流示例
// 1. 定义需要节流处理的函数
function handleScroll() {
console.log('滚动位置:', window.scrollY);
}
// 2. 创建节流函数(每100ms最多执行一次)
const throttledScroll = eventBox.throttle(handleScroll, 100);
// 3. 绑定到滚动事件
window.addEventListener('scroll', throttledScroll);
// 4. 手动取消节流(可选)
// throttledScroll.cancel();