@mt-kit/utils
Version:
54 lines (47 loc) • 1.35 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo-debounce</title>
</head>
<body>
<input type="text">
<button>中途取消防抖</button>
</body>
</html>
<script src="../lib/index.js"></script>
<script>
const { debounce } = microUtil;
const inputEl = document.querySelector("input");
const buttonEl = document.querySelector("button");
let counter = 0;
const onInput = function() {
console.log("触发 inputEl.oninput" + ++counter);
};
const onInputDebounce = debounce(onInput, 2000, true)
inputEl.oninput = onInputDebounce;
buttonEl.onclick = function(){
console.log("取消了接下来的触发");
onInputDebounce.cancel();
}
</script>
<script type="module">
// import debounce from '../dist/debounce/index.js';
//
// const inputEl = document.querySelector("input");
// const buttonEl = document.querySelector("button");
// let counter = 0;
//
// const onInput = function() {
// console.log("触发 inputEl.oninput" + ++counter);
// };
//
// const onInputDebounce = debounce(onInput, 2000, true)
//
// inputEl.oninput = onInputDebounce;
//
// buttonEl.onclick = function(){
// console.log("取消了接下来的触发");
// onInputDebounce.cancel();
// }
</script>