我在asp.net中使用javascript创建了一个倒数计时器。完成时间后,Button1
将被禁用,但当我重新加载页面时,倒计时器会重置并启用Button1
。
我想在计时器等于零时永久禁用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 :(得分: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
答案 1 :(得分:0)
当您重新加载页面时,页面状态会完全重置,就好像新访问者找到了您的网页,因此您需要能够在访问之间存储该状态。
一个解决方案是use a cookie,你可以在计时器到期时设置,并在页面加载时检查cookie的存在。如果它在那里,请在没有计时器的情况下立即禁用该按钮。
更复杂的解决方案是调查在服务器上保存会话状态,但我不知道你在服务器端发生了什么,所以我不能给你很多东西。
答案 2 :(得分:0)
您可以在计时器关闭时设置Cookie。并在每个页面加载检查cookie并在需要时禁用该按钮。没有其他办法。
仅供参考:您可以使用相同的cookie来禁用服务器端的按钮。
答案 3 :(得分:-1)
的Javascript
document.getElementById("myBtn").disabled = true;
或者如果你需要jquery-点击
$('.rbutton').on('click',function() {
$(this).prop("disabled",true);
});