獲取驗證碼倒計時優化 頁面刷新實時倒計時

1.點擊獲取驗證碼按鈕，改變按鈕爲不可點擊狀態，進行倒計時計時器，而且實時記錄倒計時秒數，以及當前時間time1。

2.頁面刷新的時候監聽倒計時按鈕，獲取倒計時秒數，以及頁面關閉的時的時間time1，和當前時間time2。

3.若是當前時間與關閉頁面的時間的差  小於關閉頁面的倒計時秒數，倒計時任然再進行，修改按鈕爲倒計時樣式。

//防止頁面刷新倒計時失效
/**
 * 
 * @param {Object} obj  獲取驗證碼按鈕
 */
function monitor(obj) {
    var LocalDelay = getLocalDelay();
    var timeLine = parseInt((new Date().getTime() - LocalDelay.time) / 1000);
    if (timeLine > LocalDelay.delay) {
        console.log("過時");
    } else {
        _delay = LocalDelay.delay - timeLine;
        obj.text(_delay).addClass("btn-disabled");
        var timer = setInterval(function() {
            if (_delay > 1) {
                _delay--;
                obj.text(_delay);
                setLocalDelay(_delay);
            } else {
                clearInterval(timer);
                obj.text("獲取驗證碼").removeClass("btn-disabled");
            }
        }, 1000);
    }
};

//倒計時效果
/**
 * 
 * @param {Object} obj 獲取驗證碼按鈕
 * @param {Function} callback  獲取驗證碼接口函數
 */
function countDown(obj, callback) {
    if (obj.text() == "獲取驗證碼") {
        var _delay = 60;
        var delay = _delay;
        obj.text(_delay).addClass("btn-disabled");
        var timer = setInterval(function() {
            if (delay > 1) {
                delay--;
                obj.text(delay);
                setLocalDelay(delay);
            } else {
                clearInterval(timer);
                obj.text("獲取驗證碼").removeClass("btn-disabled");
            }
        }, 1000);

        callback();
    } else {
        return false;
    }
}

//設置setLocalDelay
function setLocalDelay(delay) {
    //location.href做爲頁面的惟一標識，可能一個項目中會有不少頁面須要獲取驗證碼。
    localStorage.setItem("delay_" + location.href, delay);
    localStorage.setItem("time_" + location.href, new Date().getTime());
}

//getLocalDelay()
function getLocalDelay() {
    var LocalDelay = {};
    LocalDelay.delay = localStorage.getItem("delay_" + location.href);
    LocalDelay.time = localStorage.getItem("time_" + location.href);
    return LocalDelay;
}

<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
        <script type="text/javascript" src="js/getcode.js"></script>
        <script>
            $(function() {
                var btn = document.getElementById("btn-getcode");
                //調用監聽
                monitor($(btn));
                //點擊click
                btn.onclick = function() {
                    //倒計時效果  getCode回調函數  獲取驗證碼api
                    countDown($(this), getCode);
                };

                function getCode() {
                    $.get("http://192.168.50.242:8080/demo/js/json.json", {}, function(res) {
                        if (res.code == 000) {
                            console.log("驗證碼將發送到你手機");
                        } else {
                            alert(res.message);
                        }
                    });
                }
            });
        </script>