[英]javascript counter - how to include more than one counter on the same page?
有人可以幫我在一個頁面內實現兩個JavaScript計數器嗎? 我目前正在啟動並運行計數器,但是當我嘗試為另一個計數器創建新的div時,原始計數器消失,僅顯示一個計數器。 這是我的第一篇文章,因此請原諒任何混亂的格式。 我將不勝感激任何幫助,我對javascript很陌生。 謝謝!
這是我的代碼:
<div id="counter"></div>
<div id="counter1"></div>
<script type="text/javascript">
var START_DATE = new Date("July 27, 2010 13:30:00"); // put in the starting date here
var INTERVAL = 1; // in seconds
var INCREMENT = 2; // increase per tick
var START_VALUE = 9001; // initial value when it's the start date
var count = 0;
window.onload = function()
{
var msInterval = INTERVAL * 1000;
var now = new Date();
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
document.getElementById('counter').innerHTML = addCommas(count);
setInterval("count += INCREMENT; document.getElementById('counter').innerHTML =
addCommas(count);", msInterval);
}
</script>
<script type="text/javascript">
var START_DATE = new Date("July 27, 2011 13:30:00"); // put in the starting date here
var INTERVAL = 1; // in seconds
var INCREMENT = 2; // increase per tick
var START_VALUE = 8001; // initial value when it's the start date
var count = 0;
window.onload = function()
{
var msInterval = INTERVAL * 1000;
var now = new Date();
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
document.getElementById('counter1').innerHTML = addCommas(count);
setInterval("count += INCREMENT; document.getElementById('counter1').innerHTML =
addCommas(count);", msInterval);
}
</script>
<script type="text/javascript">
function addCommas(nStr)
{
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
</script>
您不能有兩個window.onload
腳本,最后一個將覆蓋第一個。
只需重復使用相同的代碼,然后將下一個計數器添加到下一個div中即可。
window.onload = function()
{
var msInterval = INTERVAL * 1000;
var now = new Date();
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
document.getElementById('counter').innerHTML = addCommas(count);
setInterval("count += INCREMENT; document.getElementById('counter').innerHTML = addCommas(count);", msInterval);
document.getElementById('counter1').innerHTML = addCommas(count);
setInterval("document.getElementById('counter1').innerHTML = addCommas(count);", msInterval);
}
編輯:遞增計數僅一次,否則第二個計數器總是在第一個計數器之前
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.