2017-08-15 67 views
3

我在asp.net中創建了一個使用javascript的倒計時器。完成時間後,Button1變爲禁用狀態,但當我重新加載頁面時,倒數計時器將被重置並啓用Button1如何永久禁用在asp.net中使用Javascript的按鈕?

當timer等於零時,我想永久禁用Button1。我的代碼是:

var tim; 
 
var min = 01; 
 
var sec = 00; 
 
var f = new Date(); 
 
function f1() { 
 
    f2(); 
 
} 
 

 
function f2() { 
 
    if (parseInt(sec) > 0) { 
 
    sec = parseInt(sec) - 1; 
 
    document.getElementById("showtime").innerHTML = ""+min+" Minutes ,"+sec+" Seconds"; 
 
    tim = setTimeout("f2()", 1000); 
 
    } 
 
    else { 
 
    if (parseInt(sec) == 0) { 
 
     min = parseInt(min) - 1; 
 
     if (parseInt(min) == -1) { 
 
     clearTimeout(tim); 
 
     $("#Button1").prop('disabled', true); 
 
     } 
 
     else { 
 
     sec = 60; 
 
     document.getElementById("showtime").innerHTML = "" + min + " Minutes ," + sec + " Seconds"; 
 
     tim = setTimeout("f2()", 1000); 
 
     } 
 
    } 
 
    } 
 
}
<body onload="f1()"> 
 
<div><h3>Time will be finished after:</h3> 
 
</div> 
 
<div id="showtime"></div> 
 
<div> <asp:Button ID="Button1" runat="server" Text="Submit"/></div>` 
 
</body>

+0

MMMMMM每次刷新倒計時重啓 – Gerard

+0

的主要問題是IM面臨:(@ashik –

+0

此頁面時一個cookie – Owais

回答

-1

的Javascript

document.getElementById("myBtn").disabled = true; 

或者如果u有jquery-需要點擊

$('.rbutton').on('click',function() { 
$(this).prop("disabled",true); 
}); 
+0

感謝,但我想要在完成時間後永久禁用它,因爲現在它禁用按鈕一段時間,但重新加載webform後,按鈕再次啓用並且計時器再次從開始啓動 – Owais

0

當你重新載入頁面,狀態的頁面被完全重置,就好像一個新的訪問者已經找到了你的頁面所以你需要能夠在訪問之間存儲該狀態。

一種解決方案是use a cookie,您可以在計時器到期時設置它,並在頁面加載時檢查cookie是否存在。如果它在那裏,請立即禁用按鈕,而無需計時器。

一個更復雜的解決方案是調查您的服務器上保存會話狀態,但我不知道你在服務器端進行了什麼,所以我不能讓你在那裏繼續。

0

當計時器關閉時,您可以設置cookie。並且在每次頁面加載時檢查cookie並在需要時禁用該按鈕。沒有其他辦法。

供參考:您可以使用相同的cookie來禁用服務器端本身的按鈕。

1
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script> 

<script> 
function f2() { 
    if (parseInt(sec) > 0) { 
    sec = parseInt(sec) - 1; 
    document.getElementById("showtime").innerHTML = ""+min+" Minutes ,"+sec+" Seconds"; 
    tim = setTimeout("f2()", 1000); 
    } 
    else { 
    if (parseInt(sec) == 0) { 
    min = parseInt(min) - 1; 
     if (parseInt(min) == -1) { 
     clearTimeout(tim); 
     $("#Button1").prop('disabled', 'true'); 
     storeValue('disabled', 'true'); 
     } 
     else { 
     sec = 60; 
     document.getElementById("showtime").innerHTML = "" + min + " Minutes ," + sec + " Seconds"; 
     tim = setTimeout("f2()", 1000); 
     } 
    } 
    } 
} 
function storeValue(key, value) { 
    if (localStorage) { 
    localStorage.setItem(key, value); 
    } else { 
    $.cookies.set(key, value); 
    } 
} 

function getStoredValue(key) { 
    if (localStorage) { 
    return localStorage.getItem(key); 
    } else { 
    return $.cookies.get(key); 
    } 
} 
function f1() { 
f2(); 
var model =getStoredValue('disabled'); 
if(model == 'true') 
{ 
    $("#Button1").prop('disabled', 'true'); 
} 
} 
var tim; 
var min = 01; 
var sec = 00; 
var f = new Date(); 
</script> 

使用此代碼,使thrid party localstorage在瀏覽器中使用

+0

非常感謝您的寶貴時間和幫助:) @ Saneesh – Owais