禁用 <select>啟用復選框時

Question

當啟用ID為“ exactage”的復選框時，我想使用Javascript將屬性disable =“ disabled”設置為ID年齡為2。 有任何想法嗎？ 提前致謝。 一個快樂的編碼器:)

 <select id="age">
        <option value="18"><18</option>
    </select>

    <select id="age2">
        <option value="18"><18</option>
    </select>

   <input type="checkbox" id="exactage"/> Require exact age

Answer 1

請注意，當我編寫此答案時，我有一個短暫的盲點：我可能發誓我看到了一個jquery標簽。 嘆。 我的錯誤是，現在不值得修改此答案，因為發布了其他功能純JS答案，所以我無法改進。

但是，我將其更改為社區Wiki，暫時將其保留為進一步的信息。

---

如果您使用的是jQuery， 則以下內容應該為您工作（有關盲區，請參閱我上面的附錄）：

$('#exactage').change(
    function(){
        if ($(this).is(':checked')){
            $('#age2').prop('disabled',true);
        }
        else {
            $('#age2').prop('disabled',false);
        }
    });

在#exactage復選框的change事件中， if檢查$(this)是否$(this) :checked 。 如果是，則設置#age2元素的disabled屬性，否則它將刪除/取消設置disabled屬性。

參考文獻：

• change() 。
• :checked選擇器 。
• is() 。
• prop() 。

Answer 2

如果啟用，則表示已選中

if(document.getElementById('exactage').checked)
    document.getElementById('age2').setAttribute('disabled', 'disabled');

如果“啟用”實際上是指“啟用”，則可以執行以下操作：

if(document.getElementById('exactage').getAttribute('disabled') !== null)
    document.getElementById('age2').setAttribute('disabled', 'disabled');

Answer 3

您可以嘗試onclick或onselect（我認為有類似的東西）屬性來調用方法在方法try中

document.getElementById('age2').setEnabled(false) 

要么

    document.getElementById('age2').disabled=disabled

沿着這條線..我不記得了:(

Answer 4

嘗試使用以下內容。

if(document.getElementById('exactage').checked)
{
    document.getElementById('age2').disabled=true;
}

Answer 5

首先你需要這些

function changeState(id, state)
{
    if(state == 0)
        document.getElementById(id).disabled = true;
    else
        document.getElementById(id).disabled = false;
}

function toggleFields(id, state)
{
    var e=document.getElementById(id);
    if(!e)return true;
    if(state == 1)
    {
        e.style.display=""
    }
    else
    {
        e.style.display="none";
    }
    return true;
}

其次是這些

function checkBoxState(check_box_id, field_id, flag)
{
    if(document.getElementById(check_box_id).checked)
    {
        if(flag == 1)
            toggleFields(field_id, 1);
        else if(flag == 0)
            changeState(field_id, 1);
        document.getElementById(check_box_id).value = 1;
    } else {
        if(flag == 1)
            toggleFields(field_id, 0);
        else if(flag == 0)
            changeState(field_id, 0);
        document.getElementById(check_box_id).value = 0;
    }
}

function reversedCheckBoxState(check_box_id, field_id, flag)
{
    if(document.getElementById(check_box_id).checked)
    {
        if(flag == 1)
            toggleFields(field_id, 0);
        else
            changeState(field_id, 0);
        document.getElementById(check_box_id).value = 1;
    } else {
        if(flag == 1)
            toggleFields(field_id, 1);
        else
            changeState(field_id, 1);
        document.getElementById(check_box_id).value = 0;
    }
}

現在，您要做的就是運行reversedCheckBoxState（“ exactage”，“ age2” 0）或運行reversedCheckBoxState（“ exactage”，“ age2” 1）

請享用！