1.常規(guī)text標簽

在JavaScript中，您可以通過修改元素的屬性來給input標簽增加disabled屬性。這可以通過使用setAttribute方法來完成。以下是一個簡單的例子：

// 假設您的input元素的id是'myInput'
var inputElement = document.getElementById('myInput');

// 給input元素添加disabled屬性
inputElement.setAttribute('disabled', 'disabled');

在上面的代碼中，getElementById方法用于選擇頁面中ID為myInput的input元素。然后，setAttribute方法用于添加disabled屬性，將其值設置為"disabled"。
這樣設置之后，該input元素就會變?yōu)椴豢删庉嫚顟B(tài)。如果您想要在以后取消disabled屬性，可以將值設置為空字符串：

// 取消disabled屬性
inputElement.setAttribute('disabled', '');

或者，您也可以使用removeAttribute方法來完全移除該屬性：

// 移除disabled屬性
inputElement.removeAttribute('disabled');

在實際應用中，請根據您的具體情況選擇合適的方法。

2.radio標簽

在JavaScript中，您可以通過修改元素的屬性來給input元素的radio類型標簽增加disabled屬性。以下是一個示例代碼，展示了如何通過JavaScript為指定的單選按鈕（radio button）設置disabled屬性：

// 假設您的單選按鈕具有一個共同的類名，比如 'myRadio'
var radios = document.querySelectorAll('.myRadio');

radios.forEach(function(radio) {
    // 您可以按需修改這里的條件，以確定哪些單選按鈕應該被禁用
    if (/* 添加您的條件判斷 */) {
        radio.disabled = true;
    }
});

在上面的代碼中，querySelectorAll用于選擇所有具有類名myRadio的元素。然后，forEach方法用于遍歷這些元素，并在滿足您設定條件的情況下設置disabled屬性為true。

請根據您的具體情況調整條件判斷部分。例如，如果您想禁用所有處于特定狀態(tài)的按鈕，可以檢查它們的checked屬性或其他相關屬性。如果您想根據用戶的某些操作動態(tài)禁用單選按鈕，可以在事件處理函數中添加相應的邏輯。

還可以全局進行禁用，一下是代碼示例：

// 獲取所有 radio 元素
const radioElements = document.querySelectorAll('input[name="row[status]"]');
// 為每個 radio 元素添加 change 事件監(jiān)聽器
radioElements.forEach(radio => {
    radio.disabled = true;
});

附：input屬性disabled和readonly的區(qū)別

1.disabled和readonly使用實例

disabled寫法：<input type="text" name="aaa" value="xxx" disabled />

readonly寫法：  <input type="text" name="bbb" value="xxx" readonly />

2.兩種寫法的相同點：

 都會使文本框變成只讀，不可編輯

3.兩種寫法的不同點： 

1.disabled屬性在將input文本框變成只讀不可編輯的同時，還會使文本框變灰，但是readonly不會。

2.disabled屬性修飾后的文本框內容，在不可編輯的同時，通過js也是獲取不到的。例如$("input [name='aaa']").val()是不好用的。但是用readonly修飾后的文本框內容，是可以通過js獲取到的，也就只是簡單的不可編輯而已！

3.disabled屬性對input文本框，單選radio,多選checkbox都適用，但是readonly就不適用，用它修飾后的單選以及多選按鈕仍然是可以編輯狀態(tài)的。

總結 

到此這篇關于HTML使用js給input標簽增加disabled屬性的文章就介紹到這了,更多相關js給input增加disabled屬性內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論