在兩個不同的html頁面上同時啓動定時器

-1

我希望當我點擊計時器開始，該時間控制頁面，監控頁面上啓動的同時，並停止點擊

我怎麼能做到這一點的時候也停止在一起呢？

var team1_timer = 00; 
 
window.onload = function() { 
 
    
 
    var seconds = 00; 
 
    var tens = 00; 
 
    var appendTens = document.getElementById("tens") 
 
    var appendSeconds = document.getElementById("seconds") 
 
    var buttonStart = document.getElementById('button-start'); 
 
    var buttonStop = document.getElementById('button-stop'); 
 
    var buttonReset = document.getElementById('button-reset'); 
 
    var Interval; 
 

 
    buttonStart.onclick = function() { 
 
    clearInterval(Interval); 
 
    Interval = setInterval(startTimer, 10); 
 
    } 
 
    
 
    buttonStop.onclick = function() { 
 
     clearInterval(Interval); 
 
    } 
 
    
 
    buttonReset.onclick = function() { 
 
    clearInterval(Interval); 
 
    tens = "00"; 
 
    seconds = "00"; 
 
    appendTens.innerHTML = tens; 
 
    appendSeconds.innerHTML = seconds; 
 
    } 
 
    
 
    function startTimer() { 
 
    tens++; 
 
    
 
    if(tens < 9){ 
 
     appendTens.innerHTML = "0" + tens; 
 
    } 
 
    
 
    if (tens > 9){ 
 
     appendTens.innerHTML = tens; 
 
     
 
    } 
 
    
 
    if (tens > 99) { 
 
     console.log("seconds"); 
 
     seconds++; 
 
     team1_timer = seconds; 
 
     appendSeconds.innerHTML = "0" + seconds; 
 
     tens = 0; 
 
     appendTens.innerHTML = "0" + 0; 
 
    } 
 
    
 
    if (seconds > 9){ 
 
     appendSeconds.innerHTML = seconds; 
 
    } 
 
    team1_timer = seconds; 
 
    } 
 

 
    /////////////////////////////////////////// 
 

 
    var seconds_hold = 00; 
 
    var tens_hold = 00; 
 
    var appendTens_hold = document.getElementById("tens_hold") 
 
    var appendSeconds_hold = document.getElementById("seconds_hold") 
 
    var buttonStart_hold = document.getElementById('button-start_hold'); 
 
    var buttonStop_hold = document.getElementById('button-stop_hold'); 
 
    var buttonReset_hold = document.getElementById('button-reset_hold'); 
 
    var Interval_hold ; 
 

 
    buttonStart_hold.onclick = function() { 
 
    clearInterval(Interval_hold); 
 
    Interval_hold = setInterval(startTimer_hold, 10); 
 
    } 
 
    
 
    buttonStop_hold.onclick = function() { 
 
    clearInterval(Interval_hold); 
 
    } 
 
    
 
    buttonReset_hold.onclick = function() { 
 
    clearInterval(Interval_hold); 
 
    tens_hold = "00"; 
 
    seconds_hold = "00"; 
 
    appendTens_hold.innerHTML = tens_hold; 
 
    appendSeconds_hold.innerHTML = seconds_hold; 
 
    } 
 
    
 
    function startTimer_hold() { 
 
    tens_hold++; 
 
    
 
    if(tens_hold < 9){ 
 
     appendTens_hold.innerHTML = "0" + tens_hold; 
 
    } 
 
    
 
    if (tens_hold > 9){ 
 
     appendTens_hold.innerHTML = tens_hold; 
 
     
 
    } 
 
    
 
    if (tens_hold > 99) { 
 
     console.log("seconds_hold"); 
 
     seconds_hold++; 
 
     appendSeconds_hold.innerHTML = "0" + seconds_hold; 
 
     tens_hold = 0; 
 
     appendTens_hold.innerHTML = "0" + 0; 
 
    } 
 
    
 
    if (seconds_hold > 9){ 
 
     appendSeconds_hold.innerHTML = seconds_hold; 
 
    } 
 
    } 
 
}

<div class="wrapper" style="float:left;"> 
 
     <a id="button-start" style="margin-right: 10px; margin-top: -12px;" class="btn btn-success">Start</a> 
 
     <button name="saveRoundTeam1" style=" margin-right: 10px;margin-top: -12px;" onclick="getTime()" class="btn btn-warning">Stop</button> 
 
     
 
     <a id="button-reset" class="btn btn-danger" style=" margin-right: 10px;margin-right:30px; margin-top: -12px;">Reset</a> 
 
     <span style="font-size:30px; color:red; margin-right:30px;" id="">AHT</span> 
 
     <span id="seconds" style="font-size:30px; ">00</span> 
 
     <span style="font-size:0px; color: #eff4ff;" id="tens">00</span> 
 
    </div> 
 
    <br><br><br><br> 
 
    <div class="wrapper"> 
 
     <a id="button-start_hold" style="margin-right: 10px; margin-top: -12px" class="btn btn-success">Start </a> 
 
     <a id="button-stop_hold" style=" margin-right: 10px;margin-top: -12px" class="btn btn-warning">Stop </a> 
 
     <a id="button-reset_hold" class="btn btn-danger" style=" margin-right: 10px;margin-right:30px; margin-top: -12px">Reset </a> 
 
     <span style="font-size:30px; color:red; margin-right:30px;" id="">HOLD</span> 
 
     <span style="font-size:30px;" id="seconds_hold">00</span><span id="tens_hold" style="font-size:0px; color: #eff4ff;">00</span> 
 
     <a id="button-stop"></a> 
 
    </div>

來源

2017-02-26 Amro Ez

目前尚不清楚你的兩頁的意思。 – mplungjan

第1頁：http：//mipssoftware.com/vodafone/team1.php 第2頁：http：//mipssoftware.com/vodafone/result.php –

您需要使用window.open從一個頁面打開頁面，將定時器保留在父頁面上。然後你可以設置和查詢opener.team1_timer – mplungjan

在父頁面

var team1_timer = 0;  
var team1Win = window.open("team1.php","team1"); 
var resultWin = window.open("result.php","team1");

，並在子頁面有

opener.team1_timer = seconds;

和TEAM1頁有

buttonStart_hold.onclick=function() { 
    opener.result.buttonStart_hold.onclick(); 
...

並在結果頁面有

buttonStart_hold.onclick=function() { 
    opener.team1.buttonStart_hold.onclick(); 
...

等

來源

2017-02-26 17:17:08 mplungjan

感謝您的回覆，我會嘗試它 –

在兩個不同的html頁面上同時啓動定時器

回答

相關問題