使用javascript從下拉列表中禁用多個選項

我在下拉列表中有以下選項。使用javascript從下拉列表中禁用多個選項

<select> 

    <option value="FRUIT">FRUIT</option> 
    <option value="MANGO">MANGO</option> 
    <option value="APPLE">APPLE</option> 
    <option value="BANANA">BANANA</option> 

    <option value="GRADES">GRADES</option> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    <option value="C">C</option> 

</select>

我想永久禁用（只讀）FRUIT和GRADES。我怎樣才能達到這個結果使用JavaScript？

來源

2016-12-05 Aniket

這取決於點擊事件後的操作。在.NET中，當我說「選擇選項」我知道不處理它時，我有一個默認值'abc123'。什麼是您的發佈用戶點擊操作？ – indofraiser

如果你想永久禁用它，那麼使用javascript就很浪費了。使用HTML'optgroup'，你不必擔心javascript。我提供的解決方案低於 – KuKeC

您應該使用「禁用」屬性。例如：

<option value="FRUIT" disabled>FRUIT</option> 
<option value="GRADES" disabled>GRADES</option>

如果你在你的頁面上使用jQuery，所以按照下面的代碼：

<script> 
    function myFunction() { 
    document.getElementById("mySelect").disabled = true; 
    } 
</script>

HTML代碼應該是這樣：

<option id="mySelect" value="FRUIT" disabled>FRUIT</option> 
<option id="mySelect" value="GRADES" disabled>GRADES</option>

來源

2016-12-05 11:51:17 shakil

使用屬性它的工作，但根據我的要求JavaScript功能需要做同樣的 – Aniket

– shakil

使用以下代碼：您的html代碼應該如下所示： – shakil

<select name="selectField"> <option value="FRUIT" disabled>FRUIT</option> 
      <option value="MANGO"> 
       MANGO 
      </option> 
      <option value="APPLE"> 
      APPLE 
</option> 
      <option value="BANANA">BANANA</option> 

      <option value="GRADES" disabled>GRADES</option> 
      <option value="A">A</option> 
      <option value="B">B</option> 
      <option value="C">C</option> 
</select>

希望這一個幫助。只要嘗試這一個！

來源

2016-12-05 11:52:12 DSK

您需要在0123中選擇optgroup。 <optgroup>用於將下拉列表中的相關選項分組。 Chek this。

你的榜樣應該是這樣

optgroup[readonly] { 
 
    background-color: #eeeeee; 
 
    color: #555555; 
 
}

<select> 
 
     <optgroup label="FRUIT" readonly="readonly">   
 
     <option value="MANGO">MANGO</option> 
 
     <option value="APPLE">APPLE</option> 
 
     <option value="BANANA">BANANA</option> 
 
     </optgroup> 
 
     <optgroup label="GRADES" disabled="disabled"> 
 
     <option value="A">A</option> 
 
     <option value="B">B</option> 
 
     <option value="C">C</option> 
 
     </optgroup> 
 
    </select>

而且readonly選項仍然submittable。

來源

2016-12-05 12:08:28 KuKeC

使用javascript從下拉列表中禁用多個選項

回答

相關問題