Как установить входной тег как включенный?

Question

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>
 

Я хочу, чтобы люди прочитали соглашение о регистрации по крайней мере за 5 секунд до того, как они отправят свою регистрацию, когда закончится 5 секунд, please register now можете показать на веб-странице, как сделать <input id="regBtn" type="button" value="register" /> Работа?

Я делаю некоторые попытки для disableRegBtn() в showTime функция.

disableRegBtn(false)
disableRegBtn("false")
disableRegBtn("disabled")
disableRegBtn("enabled")  

Ни один из них не может вступить в силу.

Answer 1

Вам не нужно снова создавать кнопку, так как она уже есть в DOM.

Вы можете использовать переменные для хранения элементов, чтобы вы могли использовать их, когда они вам нужны. Это гарантирует, что ваш код будет более чистым и надежным.

Вместо того, чтобы передать включен, вы можете пройти flase когда счетчик 0, Я также предлагаю вам использовать textContent вместо innerHTML при работе только с текстовым контентом, поскольку он более предсказуемый.

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>

Answer 2

Ваша кнопка удалена при выполнении document.getElementById("p1").innerHTML = "please register in... просто добавьте кнопку снова после тайм-аута

var startat = 5;

function disableRegBtn(bdisable) {
  document.getElementById('regBtn').disabled = bdisable;
}

function showTime() {
  if (startat == 0) {
    clearInterval(timeId);
    document.getElementById("p1").innerHTML = '<input id="regBtn" type="button" value="register" />';
    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>