JS input输入节流

最新推荐文章于 2024-08-27 20:56:01 发布

甘乐2333

最新推荐文章于 2024-08-27 20:56:01 发布

阅读量2.2k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/qq_35254240/article/details/90766074

版权

前端专栏收录该内容

61 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        input
        {
            color: #999999;
        }
    </style>
</head>
<body>
    <input type="text">
    <script>
        /*
        *  节流
        *   设置在input输入时,间隔一定时间后再进行判断设置等内容,在间隔的时间内不再做任何处理
        *
        * */
        var text=document.querySelector("input");
        var ids=0;
        text.addEventListener("input",inputHandler);

        function inputHandler(e) {
            if(ids) return;
            ids=setTimeout(textContentHandler,500,this);

        }
        function textContentHandler(elem) {
            console.log(elem.value);
            clearTimeout(ids);
            ids=0;

        }
    </script>
</body>
</html>