启用和禁用按钮不起作用[关闭]答案

【问题标题】：enable and disable button is not working [closed]启用和禁用按钮不起作用[关闭]
【发布时间】：2013-02-08 18:41:24
【问题描述】：

我正在尝试处理表单。目前，该按钮已禁用。但是，当您单击复选框时，该按钮应启用，如果您没有单击复选框，则应再次禁用该按钮。当我单击复选框时，我无法启用按钮。我的循环可能有问题。循环在函数 checkAge 中。有什么解决办法吗？

Javascript

function checkAge(e){

var theTarget = e.target ? e.target : e.srcElement;
alert(theTarget.id);

var form = document.getElementById("form");
if (document.getElementById("content")) {
    form.removeChild(document.getElementById("content"));
}

if(theTarget.id == "fourteen"){
    var newDiv = document.createElement("div");
    newDiv.setAttribute("id", "content");

    var br = document.createElement("br");
    newDiv.appendChild(br);
    var br = document.createElement("br");
    newDiv.appendChild(br);

    newDiv.appendChild(document.createTextNode("Vilka seriefigurer träffade du?"));

    var br = document.createElement("br");
    newDiv.appendChild(br);

    var musse = document.createElement('input');
    musse.setAttribute("type", "checkbox");
    musse.setAttribute("name", "musse");
    musse.setAttribute("value", "musse");
    musse.setAttribute("id", "musse");
    newDiv.appendChild(musse);
    newDiv.appendChild(document.createTextNode("Musse"));

    var br = document.createElement("br");
    newDiv.appendChild(br);

    var adi = document.createElement('input');
    adi.setAttribute("type", "checkbox");
    adi.setAttribute("name", "adi");
    adi.setAttribute("value", "adi");
    adi.setAttribute("id", "adi");
    newDiv.appendChild(adi);
    newDiv.appendChild(document.createTextNode("Ådi"));

    var br = document.createElement("br");
    newDiv.appendChild(br);

    var bamse = document.createElement('input');
    bamse.setAttribute("type", "checkbox");
    bamse.setAttribute("name", "bamse");
    bamse.setAttribute("value", "bamse");
    bamse.setAttribute("id", "bamse");
    newDiv.appendChild(bamse);
    newDiv.appendChild(document.createTextNode("Bamse"));

    var br = document.createElement("br");
    newDiv.appendChild(br);

    var input = document.createElement("input");
    input.setAttribute("type", "submit");
    input.setAttribute("name", "submit");
    input.setAttribute("id", "submit");
    input.setAttribute("value", "Skicka");
    newDiv.appendChild(input);

    form.appendChild(newDiv);

    var inputs = document.getElementsByTagName("input");
    for(i=0; i<inputs.length; i++){
        input.disabled = true;
        if(inputs[i].type == "checkbox" && inputs[i].checked){
            input.disabled = false;
        }
        else{
            input.disabled = true;
        }

    }

}

【问题讨论】：

抱歉，不想错过任何解决问题的关键代码。
忽略 checkAge 函数以外的所有内容。

标签： javascript html forms input disabled-input

【解决方案1】：

当您创建复选框时，您不会将任何事件附加到它们。禁用输入的循环仅在您创建表单的 checkAge 部分时发生，并且永远不会再次执行。如果您将偶数附加到复选框，那么它应该可以解决您的问题。

此外，您的 checkAge 函数将复选框输入添加到文档中，但您从未更新您的 inputs 数组以包含复选框。

您可能需要考虑最初将所有 HTML 元素添加到页面，然后使用 display:none/display:block 隐藏/显示元素。

【讨论】：