啓動功能再次自動

Question

我試圖做的，每當我的頁面「test.php的」負載，然後我的函數將每當用戶點擊在#start

當用戶從廣告導航離開（另一個開始例如），然後該功能將停止。 （working）

每當用戶回到選項卡（test.php）時，函數應該重新開始。我似乎無法找到該怎麼做。目前我有這樣的：

$("body").on('click', '#start', function() 
        { 
         $('#website').focus(); 
         $('.message').html('<div class="alert info"><b id="seconds">'+parseFloat($seconds-$current_second)+'</b> seconds remaining.</div>'); 
         if($timer !== null) return; 
         $timer = setInterval(function() 
         { 
          if($current_second==$seconds) 
          { 
           clearInterval($timer); 
           $('body').addClass('done'); 
           $('.message').html('<div class="alert info">Validating advertisement&hellip;</div>'); 

           $.post('index.php?i=v&p=k&token=' + token,{'key': key,'token':token,'time':time,'stime':stime}, 
             function (data) { 
              proccessData(data); 
             }); 
           return false; 
          } 
          else 
          { 
           var $counter_bar_width = $('#bar').innerWidth(); 


           //$('#bar').css('width',parseFloat($counter_bar_width+$width_per_second).toFixed(2)); 
           var left = (<?php echo $time; ?>-$current_second)*1000; 
           $current_second++; 
           $("#seconds").text(parseFloat($seconds-$current_second)); 
           $('#bar').animate({ 
           width:'100%' 
           }, left); 


          } 
         },1000); 
        }); 


        var vis = (function(){ 
         var stateKey, eventKey, keys = { 
          hidden: "visibilitychange", 
          webkitHidden: "webkitvisibilitychange", 
          mozHidden: "mozvisibilitychange", 
          msHidden: "msvisibilitychange" 
         }; 
         for (stateKey in keys) { 
          if (stateKey in document) { 
           eventKey = keys[stateKey]; 
           break; 
          } 
         } 
         return function(c) { 
          if (c) document.addEventListener(eventKey, c); 
          return !document[stateKey]; 
         } 
        })(); 


         var handler = function(){ 
          // calling vis() with no arguments will return a boolean 


          if (vis()) { 
          //Visible. 
    Page tab is now visible. Now the timer and the bar should start moving/counting down again. 


          } else { 
          //Not visible.      
          var myDiv = $("#bar"); 
          myDiv.clearQueue(); 
          myDiv.stop(); 
          clearInterval($timer); 
          $timer = null 
          } 
         } 

         // if a handler is passed, it gets bound to the event 
         vis(handler);  
        }); 

Answer 1

如果我理解正確的話，你需要在用戶是你的選項卡上綁定一個單擊處理程序，而當他們解除綁定已導航到另一個選項卡。

$(window).focus(function() { 
    bindClick(); 
}); 

$(window).blur(function() { 
    unBindClick(); 
}); 

function bindClick() 
{ 
    $('#start').on('click.tester', function(e){ 
     // Do your stuff here 
    }) 
} 

function unBindClick() 
{ 
    $('#start').unbind('click.tester'); 
} 

這將綁定click事件的事件監聽器當窗口已獲得焦點＃開始（你的標籤是有源），並且將取消綁定同事件偵聽器（在.tester位前置的點擊關鍵字保證你正在解綁正確的聆聽者）

阻止綁定/重新綁定的另一個選擇是綁定點擊偵聽器一次，並且只做任何事情，如果某事爲真（在這種情況下，如果窗口有焦點）

$('#start').on('click', function(e){ 

    // This currently tests for browser focus, but could test for just about anything 
    if (document.hasFocus()) { 
     // Do your stuff here 
    } 
}); 

或者，如果您想要在某處保存狀態，可以綁定單擊事件偵聽器，並使用窗口焦點和模糊事件暫停/恢復其功能。如果你要走這條路線，那麼在一箇中心對象中維護綁定和狀態可能是有意義的。

$('#start').on('click', function(e){ 

    $(window).blur(function(e){ 
     // Pause functionality 

    }).focus(function(e){ 
     // Regain functionality 

    }); 

    // Do Stuff (probably need to save state somewhere) 

});