JS Cookie丟棄和倒數計時器不工作

Question

嗨，任何人都可以看看下面，告訴我爲什麼它不工作？

我想把它全部用倒數計時器創建一個彈出框，並設置一個cookie，這樣它就不會在每個頁面上執行彈出框。它應該設置一個cookie並檢測它，我認爲它正在這樣做，但現在倒數計時器不會明顯倒計時。

$(document).ready(function() { 

if(readCookie('oldsite') != 'stay') //Unless we find the cookie, we show the banner ... 
{ 
var time_left = 12; 
var cinterval; 

cinterval = setInterval('time_dec()', 1000); 

var id = '#dialog'; 

//Get the screen height and width 
var maskHeight = $(document).height(); 
var maskWidth = $(window).width(); 

//Set heigth and width to mask to fill up the whole screen 
$('#mask').css({'width':maskWidth,'height':maskHeight}); 

//transition effect  
$('#mask').fadeIn(500); 
$('#mask').fadeTo("slow",0.9); 

//Get the window height and width 
var winH = $(window).height(); 
var winW = $(window).width(); 

//Set the popup window to center 
$(id).css('top', winH/2-$(id).height()/2); 
$(id).css('left', winW/2-$(id).width()/2); 

//transition effect 
$(id).fadeIn(2000);  

    //if Disagree word is clicked 
    $('#disagree').click(function() { 
      $(this).hide(); 
      $('.window').hide(); 
      $('#mask').hide(); 
      time_left = 0; 
    }); 

    //if mask is clicked 
    $('#mask').click(function() { 
      createCookie('oldsite', 'stay', 1); //create the cookie for 1 day 
      $(this).hide(); 
      $('.window').hide(); 
    });  
} 

//Functions 
function time_dec(){ 
time_left--; 
document.getElementById('countdown').innerHTML = time_left; 
if(time_left == 1){ 
    var originalstring = document.getElementById('countdown2').innerHTML; 
    var newstring = originalstring.replace('seconds','second'); 
    document.getElementById('countdown2').innerHTML = newstring; 
    window.location.replace("http://cadfemukandireland.com/"); 
    clearInterval(cinterval); 
} 
} 

function createCookie(name, value, days) { 
    var expires; 

    if (days) { 
     var date = new Date(); 
     date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); 
     expires = "; expires=" + date.toGMTString(); 
    } else { 
     expires = ""; 
    } 
    document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/"; 
} 

function readCookie(name) { 
    var nameEQ = encodeURIComponent(name) + "="; 
    var ca = document.cookie.split(';'); 
    for (var i = 0; i < ca.length; i++) { 
     var c = ca[i]; 
     while (c.charAt(0) === ' ') c = c.substring(1, c.length); 
     if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length)); 
    } 
    return null; 
} 

function eraseCookie(name) { 
    createCookie(name, "", -1); 
}   
}); 

的CSS是：

/* CSS Document */ 

#mask { 
position: absolute; 
left: 0; 
top: 0; 
z-index: 9000; 
background-color: #000; 
display: none; 
} 

#boxes .window { 
position: absolute; 
left: 0; 
top: 0; 
width: 440px; 
height: 200px; 
display: none; 
z-index: 9999; 
padding: 20px; 
border-radius: 15px; 
text-align: center; 
} 

#boxes #dialog { 
width: 750px; 
height: 300px; 
padding: 75px 50px 10px 50px; 
background-color: #ffffff; 
font-family: 'Segoe UI Light', sans-serif; 
font-size: 15pt; 
} 

#popupfoot { 
font-size: 16pt; 
position: absolute; 
bottom: 0px; 
width: 350px; 
left: 225px; 
padding-bottom:20px; 
} 

#disagree { 
cursor:pointer; 
} 

和HTML是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id="boxes"> 
<div id="dialog" class="window"> 
    <p>As part of our re branding to CADFEM, we have a new website</p> 
    <p>You will be redirected to the new website <span id="countdown2">in <span id="countdown">12</span> seconds</span>.</p> 
    <div id="popupfoot" style="padding-bottom:100px;"> If you wish to stay on the old website, please click <a id="disagree"><b><u>here</u></b></a> 
    </div> 
</div> 
<div id="mask"></div> 

Answer 1

您可以使用Creative Tools

<div id="timer"></div> 
<script> 
    $(document).ready(function(){ 
     $("#timer").countdown({ 
      duration : 30,    // Discount start from defined number (in this case 30 seconds) DEFAULT: 0 
      interval : 1000,   // interval in millisecond (DEFAULT: interval every 1000ms (1 second)) 
      text_before : "Redirection begins in exactly ", // initial text before number (example: Redirection begins in exactly 30), DEFAULT: blank 
      text_after : "seconds" // initial text after number (example: 30seconds), DEFAULT: blank 
     }, 
     // callback function when discount stop on 0 
     function(){ 
      this.html("Done counting, redirecting."); 
      window.location = "http://www.google.com"; 
     }); 
    }); 
</script> 

而且cookie的功能：

// Set a session cookie 
$.cookie('the_cookie', 'the_value'); 
$.cookie('the_cookie'); // -> 'the_value' 

// Set a cookie that expires in 7 days 
$.cookie('the_cookie', 'the_value', { expires: 7 }); 

// delete the cookie 
$.cookie('the_cookie', null); 

您可以複製此2個功能，與你的代碼集成或使用整個創作工具。

您也可以使用本地存儲功能，如果有什麼存儲被禁用或不存在使用的cookie：

// Set a session storage 
$.storage('the_name', 'the_value'); 

// Get session storage 
$.storage('the_name'); 

// delete storage 
$.storage('the_name', null); 

Answer 2

你反不工作，因爲你正在分析你的TIME_DEC功能作爲一個字符串

cinterval = setInterval('time_dec()', 1000); 

刪除逗號和（），你應該沒事

cinterval = setInterval(time_dec, 1000); 

Se e在這裏工作jsfiddle https://jsfiddle.net/domjgreen/zngLk99q/