javascript变量没有更新

时间:2015-08-24 18:08:40

标签: javascript

我有一个名为session的变量,当我点击一个按钮时,我会向上或向下递增。然后我有一个计时器,它接受会话变量的参数,该参数在我单击开始按钮时启动,但我的会话变量仍然是初始化它的原始值。如何更新值以便能够实时使用它?

jsfiddle - https://jsfiddle.net/0u24qr47/2/

感谢。

HTML

<h1>Adjust Work Time</h1>
<div id="workTime"></div>
<button class="btn btn-success" id="workMinus">-</button>
<button class="btn btn-success" id="workPlus">+</button>
<h1>Break Time</h1>
<div id="breakLength"></div>
<button class="btn btn-success" id="breakMinus">-</button>
<button class="btn btn-success" id="breakPlus">+</button>
<h1>Clock</h1>
<div><span class="time"></span>

</div>
<button class="btn btn-success start" id="start">start</button>

的Javascript

$(document).ready(function() {
    var session = 25;
    var breaks = 5;
    var workTime = document.getElementById('workTime');
    var breakLength = document.getElementById('breakLength');

    //update display//

    workTime.innerHTML = session;
    breakLength.innerHTML = breaks;

    //functions for updating variables//

    function wMinus() {
      session--;
      workTime.innerHTML = session;
    }

    function wPlus() {
      session++;
      workTime.innerHTML = session;
    }

    function bMinus() {
      breaks--;
      breakLength.innerHTML = breaks;
    }

    function bPlus() {
      breaks++;
      breakLength.innerHTML = breaks;
    }

    //update variables when clicked//

    $("#breakMinus").click(function() {
      bMinus();
    });

    $("#breakPlus").click(function() {
      bPlus();
    });

    $("#workMinus").click(function() {
      wMinus();
    });

    $("#workPlus").click(function() {
      wPlus();
    });

    window.onload = function () {
        console.log("in onload" + session);
        var display = document.querySelector('.time'),
            timer = new CountDownTimer(session),
            timeObj = CountDownTimer.parse(session);

        format(timeObj.minutes, timeObj.seconds);

        timer.onTick(format);

        //click//
        document.querySelector('#start').addEventListener('click', function() {
            timer.start();
        });

        function format(minutes, seconds) {
            minutes = minutes < 10 ? "0" + minutes : minutes;
            seconds = seconds < 10 ? "0" + seconds : seconds;
            display.textContent = minutes + ':' + seconds;
        }
    };
});

0 个答案:

没有答案