Javascript 代理模式模拟一个文件同步功能

最新推荐文章于 2024-08-11 18:40:36 发布

weixin_33704234

最新推荐文章于 2024-08-11 18:40:36 发布

阅读量68

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/jaychan/p/5978277.html

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <input type="checkbox" id="1">
    <input type="checkbox" id="2">
    <input type="checkbox" id="3">
    <input type="checkbox" id="4">
    <input type="checkbox" id="5">
    <input type="checkbox" id="6">
    <input type="checkbox" id="7">
    <input type="checkbox" id="8">
    <input type="checkbox" id="9">
    <input type="checkbox" id="10">
    <p id="status"></p>
<script>
    var checkbox = document.getElementsByTagName('input');

    //本体类，同步逻辑处理
    var syncFile = function(id){
        //Ajax等同步代码...
        document.getElementById('status').innerHTML = '正在同步文件'+id;
    }

    //代理类，通过一个闭包结构保存cache和timer
    var syncFileProxy = (function(){
        var cache = [];
        var timer = null;

        return function(id){
            cache.push(id);
            //小于2秒的同步请求，则不会处理
            if(timer){
                return;
            }
            timer = setTimeout(function(){
                syncFile(cache.join(','));
                clearTimeout(timer); //清除定时器
                timer = null; //重置变量
                cache = []; //重置cache数组
            },2000);
        }
    })();

    for(var i = 0; i < checkbox.length; i++){
        checkbox[i].onclick = function(){
            if(this.checked === true){
                syncFileProxy(this.id);
                //可以随时替换成 syncFile(this.id)
            }
        }
    }
</script>
</body>
</html>

转载于:https://www.cnblogs.com/jaychan/p/5978277.html

weixin_33704234

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript 代理模式模拟一个文件同步功能

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <input type="checkbox" id="1"> ...
复制链接

扫一扫