zoukankan      html  css  js  c++  java
  • input 框输入内容延时1秒请求内容

      项目中有个功能需要对话框输入内容后1秒执行请求获取模糊查询内容,为什么不即时查询呢?因为模糊查询东西很多呀,实时查询太耗性能了,所以改成当用户停止输入 1 秒后,再对用户输入的内容进行请求模糊查询。

      实现起来其实很简单,定时器,设置1秒的请求,如果内容改变再1秒内,那么就清空,1秒后则自动执行请求。

      下面来看demo:

    <div ng-controller='myCtrl'>
        <input ng-model="iValue" ng-change="valueChange(iValue)">
    </div>
    <script>
        angular.module("myApp",[])
        .controller("myCtrl",function($scope, $timeout){
            $scope.timer = null;
            $scope.valueChange = function (value) {
                $scope.iValue = value;
                $timeout.cancel($scope.timer);
                $scope.timer = $timeout(function () {
                    alert($scope.iValue);
                }, 1000);
            }
        })
    </script>

      这里我用的是 angular框架,不过思路是相同的,valueChange 方法中首先会清除一次定时器,这是为了如果他连续输入,那么间隔只要在 1 秒以下,就会一直清除定时器,不会执行定时器定义的程序,当 1 秒后,输入框内容未改变,那么最后一次改变创建的定时器则不会被清除,这样就可以向后台发送数据啦~

  • 相关阅读:
    每日算法-02旋转矩阵
    广搜
    每日算法-01
    洛谷P1162填涂颜色
    队列
    知识网站复习
    mysql索引底层的数据结构和算法
    Java中的类反射
    常见的加密方式
    计算机数制和运算的一点总结.
  • 原文地址:https://www.cnblogs.com/guofan/p/6932069.html
Copyright © 2011-2022 走看看