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 秒后,输入框内容未改变,那么最后一次改变创建的定时器则不会被清除,这样就可以向后台发送数据啦~

  • 相关阅读:
    asp.net下的网页编辑器
    在Visual C#中访问不同数据库
    VS2008 sp1中文版下载地址
    常用封装链接数据库类
    常用封装日志类
    动态构建OrderBy的Lambda表达式
    用户管理抽象类
    存储过程导出数据库数据
    应用程序xml 配置文件抽象基类
    ini文件示例说明
  • 原文地址:https://www.cnblogs.com/guofan/p/6932069.html
Copyright © 2011-2022 走看看