默認情況下，我如何灰掉下拉字段？

我寫了一個腳本來變灰下拉場如果先前的下拉選擇是不可缺少的。如果選擇了合適的下拉選項，另一個下拉選項將不再是灰色。默認情況下，我如何灰掉下拉字段？

我的問題是，我該如何，默認情況下，使下拉場變灰在頁面加載時，使之更不是當一個下拉選擇拾取灰色的？ https://jsfiddle.net/hb1k87xj/

<div class="col-md-3"> 
    <div class="form-group"> 
    <label>Request Type</label> 
    <select name="ReqType" class="form-control select2" style="width: 100%;" required> 
     <option value="" disabled selected>Select Request Type</option> 
     <option value="SecondAdditional1">SecondAdditional1</option> 
     <option value="Blah">Blah</option> 
    </select> 
    </div> 
    <!-- /.form-group --> 
</div> 
<!-- /.col --> 



<div class="col-md-3"> 
    <div class="form-group"> 
    <label>Second Additional</label> 
    <select name="SecondAdditional" class="form-control select2" style="width: 100%;"> 
     <option value="" disabled selected>Second Additional</option> 
     <option value="Test">Test</option> 
     <option value="Test2">Test2</option> 
    </select> 
    </div> 
    <!-- /.form-group --> 
</div> 
<!-- /.col --> 

          <!--This script is to gray out Second Additional if it is not chosen--> 
          <script> 
           $(document).ready(function() { 

           $('select[name="ReqType"]').change(function() { 

            if ($(this).val() === 'SecondAdditional1') { 
            $('[name="SecondAdditional"]').prop("disabled", false); 
            } else { 
            $('[name="SecondAdditional"]').prop("disabled", true); 
            } 
           }); 
           }); < /script>

來源

2017-05-11 Helene

在您選擇的元素設置殘疾人屬性，像這樣：

<select name="SecondAdditional" class="form-control select2" style="width: 100%;" disabled="true"> 
... 
</select>

來源

2017-05-11 16:25:37 dylankbuckley

哇，這樣一個簡單的解決方案。這工作，謝謝你！ – Helene

謝謝@Helene打勾，讓其他人從正確答案中受益。 – dylankbuckley

@dylankbuckley：沒有任何反對你，但我很抱歉，這不是正確的答案。設置布爾標誌用於jQuery，'$（「select」）。prop（'disabled'，true）;'但HTML屬性不同。 – deblocker

您應該設置屬性禁用或刪除它（來源：W3C HTML select disabled Attribute）

在標記：

<select name="SecondAdditional" class="form-control select2" disabled>

或（XHTML的兼容性，但每天都要工作其中）：

<select name="SecondAdditional" class="form-control select2" disabled="disabled">

在代碼：

if ($(this).val() === 'SecondAdditional1') { 
    $('[name="SecondAdditional"]').removeAttr("disabled"); 
} else { 
    $('[name="SecondAdditional"]').attr("disabled", "disabled"); 
}

來源

2017-05-11 16:40:43 deblocker

默認情況下，我如何灰掉下拉字段？

回答

相關問題