Question

我有一个带有下拉列表的html表单：

<select id="pjsaupf" name="pjsaupf" onChange="changeState()">
        <option value="nu">Nu se aplica</option>
        <option value="pfa">Persoana Fizica Autorizata PFA</option>
        <option value="pja">Persoana Juridica Autorizata PJA</option>   
</select>

-也尝试使用onchange代替onChange。什么都没改变。

我希望当我选择值为“ nu”的选项以禁用以下文本形式时，以及选择启用“ pfa”或“ pja”时：

<input type="text" id="company" name="company" class="form-control" placeholder="Companie" disabled>

我尝试了许多JavaScript代码，我将发布最相关的代码。问题是，当我选择“ nu”时，“ company”被禁用，并且可以，当我选择“ pja”时，它被启用，也可以，但是当我选择“ pfa”时，它被禁用但应该在这里启用。.不要弄清楚出了什么问题..

javascript代码：

<script>
function changeState() {
    if(document.getElementById("pjsaupf").value == "nu") {
        document.getElementById("company").disabled=true;
    }else

    if(document.getElementById("pjsaupf").value == "pfa") {
        document.getElementById("company").disabled=false;
    }
    else
    if(document.getElementById("pjsaupf").value == "pja") {
    document.getElementById("company").disabled=false;
    } 
}
</script>

和备用代码：

<script>
var select = document.getElementById('pjsaupf');

function changeState() {
    switch (this.value) {
        case '1':
            document.getElementById("company").disabled=true;
            break;
        case '2':
            document.getElementById("company").disabled=false;
            break;
        case '3':
            document.getElementById("company").disabled=false;
            break;
    }
}

select.addEventListener('change', changeState);

</script>

编辑：：我正在本地主机上运行

Answer 1

我尝试了您的代码，看来一切正常。当您选择nu时，company被禁用。选择pfa或pja时，将启用company。

尝试在隐身模式下运行相同的代码。我认为您的JavaScript已由您的浏览器缓存，并且没有使用最新代码进行更新。

以下是一个演示：

function changeState() {
    if(document.getElementById("pjsaupf").value == "nu") {
        document.getElementById("company").disabled=true;
    }else

    if(document.getElementById("pjsaupf").value == "pfa") {
        document.getElementById("company").disabled=false;
    }
    else
    if(document.getElementById("pjsaupf").value == "pja") {
    document.getElementById("company").disabled=false;
    } 
}

<select id="pjsaupf" name="pjsaupf" onChange="changeState()">
        <option value="nu">Nu se aplica</option>
        <option value="pfa">Persoana Fizica Autorizata PFA</option>
        <option value="pja">Persoana Juridica Autorizata PJA</option>   
</select>

<input type="text" id="company" name="company" class="form-control" placeholder="Companie" disabled>

Answer 2

它确实可以按原样工作，但是，我想提出一种更简化的方法：

function changeState() {
  // this one Boolean comparison is the value you need
  document.getElementById("company").disabled = (document.getElementById("pjsaupf").value == "nu");
}

<select id="pjsaupf" name="pjsaupf" onChange="changeState()">
  <option value="nu">Nu se aplica</option>
  <option value="pfa">Persoana Fizica Autorizata PFA</option>
  <option value="pja">Persoana Juridica Autorizata PJA</option>
</select>

<input type="text" id="company" name="company" class="form-control" placeholder="Companie" disabled>

无法基于下拉列表选择禁用文本输入

2 个答案: