0
我有一個名爲session的變量,當點擊一個按鈕時,我正在遞增或遞減。然後,我有一個計時器,它採用會話變量的參數,該會話變量在單擊開始按鈕時開始,但我的會話變量仍然是初始化的原始值。我如何更新價值以便能夠實時使用它?javascript變量不更新
的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;
}
};
});
爲什麼你在document.ready中有window.onload? – Shomz