如何将输入标签设置为启用？答案

【问题标题】：How to set the input tag as enabled?如何将输入标签设置为启用？
【发布时间】：2019-04-07 20:24:27
【问题描述】：

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" />工作？

我在showTime 函数中尝试了disableRegBtn()。

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

它们都不能生效。

【问题讨论】：

请注意，您的代码当前正在删除您的按钮，即 p1 的 innerHTML 已被覆盖，因此无法重新启用它，因为您将其全部删除。 disableRegBtn(false) 将起作用，因为 disabled 属性是一个布尔值。

标签： javascript disabled-input attribution

【解决方案1】：

您不需要再次创建按钮，因为它已经在 DOM 中了。

您可以使用变量来保存元素，以便在需要时使用它们。这将确保您的代码更加干净和健壮。

当计数器为0 时，您可以传递flase，而不是传递启用。我还建议您在处理纯文本内容时使用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>

【讨论】：

【解决方案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>

【讨论】：