input输入框延时防抖

本文转载自查看原文 2020-12-15 18:15 694 前端

    <body>
        <div class="firstBox">
            <div class="box">
                <div class="btn"></div>
                <input type="text" id="cph" value="" />
            </div>
            <div class="content">
            </div>
        </div>
    </body>
    <script type="text/javascript">
        var oInp = document.getElementById("cph");

        oInp.oninput = debounce(ajax, 1000);

        function debounce(handler, delay) {
            var timer = null;
            // 返回函数引用
            return function() {
                var _self = this;
                var _args = arguments;
                clearTimeout(timer);
                timer = setTimeout(function() {
                    /*改变handler的this指向。
                     * handler的this指向当前返回的函数引用，例如：oInp.oninput = debounce(ajax, 1000);
                     * 此时this就是指向oInp.oninput了
                     */
                    handler.apply(_self, _args);
                }, delay);
            }
        }

        function ajax(e) {
            console.log(e + " " + this.value);
        }
    </script>

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 React 实现input输入框的防抖和节流 React 实现input输入框的防抖和节流 Vue 防抖函数的实现（watcher监听某个输入框值得变化去请求后台特别好用） input 搜索框的防抖处理 input值变化，延时触发事件(防抖，节流) input下拉带输入框 input输入框美化 input 输入框 propertychange input输入框的各种样式 input输入框的光标