var startat = 5;
function disableRegBtn(bdisable){
document.getElementById('regBtn').disabled=bdisable;
}
function showTime(){
if(startat == 0){
clearInterval(timeId);
document.getElementById("p1").innerHTML = "please register now";
disableRegBtn("enabled");
return;
}
document.getElementById("p1").innerHTML = "please register in " + startat + " second(s)";
startat--;
}
window.onload=function(){
document.getElementById('taid').readOnly=true;
disableRegBtn(true);
timeId=setInterval("showTime()",1000);
}
<textarea id="taid" cols="30" rows="5">Registration Agreement:
1.xxxxxx
2.xxxxxx
3.xxxxxx
</textarea> <p id="p1"><input id="regBtn" type="button" value="register" /></p>
I want to make people read the registration agreement at least 5 seconds before they submit their registration,when 5 second is over,please register now
can show in webpage,how to make <input id="regBtn" type="button" value="register" />
work?
I make some tries for disableRegBtn()
in showTime
function.
disableRegBtn(false)
disableRegBtn("false")
disableRegBtn("disabled")
disableRegBtn("enabled")
None of them can take effect.
You do not need to create the button again as it is already in the DOM.
You can use variables to hold the elements so that you can use them when you need them. This will ensure that your code is more clean and robust.
Instead of passing enabled, you can pass flase
when the counter is 0
. I will also suggest you to use textContent
instead of innerHTML
when dealing with text only content as it is more faster an predictable.
var startat = 5;
var buttonEl = document.getElementById('regBtn');
var pEl = document.getElementById("p1");
function disableRegBtn(bdisable){
buttonEl.disabled = bdisable;
pEl.textContent = '';
pEl.prepend(buttonEl);
}
function showTime(){
if(startat == 0){
clearInterval(timeId);
pEl.textContent = "please register now";
disableRegBtn(false);
return;
}
pEl.textContent = "please register in " + startat + " second(s)";
startat--;
}
window.onload=function(){
document.getElementById('taid').readOnly=true;
disableRegBtn(true);
timeId=setInterval("showTime()",1000);
}
<textarea id="taid" cols="30" rows="5">Registration Agreement:
1.xxxxxx
2.xxxxxx
3.xxxxxx
</textarea> <p id="p1"><input id="regBtn" type="button" value="register" /></p>