javascript如何使checkbox不選中

Javascript 是一種腳本語言，通常用於網頁的動態特效和互動。 Checkbox 是一種用於表單的輸入元素，可讓使用者選擇一個或多個選項。在某些情況下，我們希望 checkbox 不被選中，這時候就可以使用 Javascript 來實作這個功能。

常見的情況包括：

1. 頁面載入時禁用 checkbox

有時我們希望頁面載入時某些 checkbox 預設是未選取狀態。可以給這些 checkbox 加上 disabled 屬性，使其無法被選取。

HTML 程式碼：

<input type="checkbox" name="checkbox1" value="1" disabled>
<input type="checkbox" name="checkbox2" value="2" disabled>
<input type="checkbox" name="checkbox3" value="3" disabled>

這樣這幾個 checkbox 就會一開始就是被停用的狀態，無法被選取。

2. 條件判斷停用 checkbox

有時我們需要根據使用者的選擇來判斷是否要讓某個 checkbox 處於未選取狀態。這時候可以使用 Javascript 來實作。

HTML 程式碼：

<input type="checkbox" name="checkbox1" value="1" onchange="disableIfChecked(this)">

當 checkbox 改變時，會執行 onchange 事件。在該事件中，我們可以根據 checkbox 的狀態來判斷是否要讓它變成未選取狀態。

Javascript 程式碼：

function disableIfChecked(checkbox) {
   if (checkbox.checked) {
      checkbox.checked = false;
   }
}

這段程式碼中的 if 語句判斷 checkbox 是否被選中，如果是，則將其設為未選取狀態。

3. 點擊按鈕停用 checkbox

另外一個常見情況是，我們希望使用者在點擊一個按鈕後，某些 checkbox 變成未選取狀態。同樣，這也可以用 Javascript 來實現。

HTML 程式碼：

<input type="checkbox" name="checkbox1" value="1">
<input type="checkbox" name="checkbox2" value="2">
<input type="checkbox" name="checkbox3" value="3">
<button onclick="disableCheckboxes()">Disable Checkboxes</button>

在這個範例中，我們有三個 checkbox 和一個按鈕。當點選按鈕時，Javascript 會執行函數 disableCheckboxes()，來設定 checkbox 為未選取狀態。

Javascript 程式碼：

function disableCheckboxes() {
   var checkboxes = document.getElementsByTagName('input');
   for (var i = 0; i < checkboxes.length; i++) {
      if (checkboxes[i].type == &#39;checkbox&#39;) {
         checkboxes[i].checked = false;
      }
   }
}

這段程式碼中，我們先取得所有的 input 元素，然後判斷它們的型別是否是 checkbox。如果是，就將其設為未選取狀態。

4. 在表單提交時停用 checkbox

還有一種情況是，我們希望使用者在進行表單提交時，某些 checkbox 不可選。同樣，這也可以使用 Javascript 來實作。

HTML 程式碼：

<form onsubmit="disableCheckboxesOnSubmit()">
   <input type="checkbox" name="checkbox1" value="1">
   <input type="checkbox" name="checkbox2" value="2">
   <input type="checkbox" name="checkbox3" value="3">
   <input type="submit" value="Submit">
</form>

在這個範例中，我們為 form 元素新增了一個 onsubmit 事件，也就是在表單提交時執行的函數。然後在該函數中，我們可以將 checkbox 設定為未選取狀態，以避免使用者誤操作。

Javascript 程式碼：

function disableCheckboxesOnSubmit() {
   var checkboxes = document.getElementsByTagName('input');
   for (var i = 0; i < checkboxes.length; i++) {
      if (checkboxes[i].type == 'checkbox') {
         if (checkboxes[i].checked) {
            // 如果 checkbox 被选中，则禁用它
            checkboxes[i].disabled = true;
         }
      }
   }
}

這段程式碼中，我們同樣使用了取得所有 input 元素以及判斷其類型的方法。不過這次我們判斷 checkbox 是否被選中，如果是，就將其停用。這樣，使用者在提交表單時就無法再次選取該 checkbox 了。

以上就是使用 Javascript 禁止 checkbox 被選取的方法。特別要注意的是，這些方法都會影響使用者體驗，因此需要謹慎使用。在無法避免這樣做的情況下，應該在介面中給予適當的提示，告知使用者這些 checkbox 是被停用的。

以上是javascript如何使checkbox不選中的詳細內容。更多資訊請關注PHP中文網其他相關文章！