默认情况下，我如何灰掉下拉字段？

我写了一个脚本来变灰下拉场如果先前的下拉选择是不可缺少的。如果选择了合适的下拉选项，另一个下拉选项将不再是灰色。默认情况下，我如何灰掉下拉字段？

我的问题是，我该如何，默认情况下，使下拉场变灰在页面加载时，使之更不是当一个下拉选择拾取灰色的？ 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

默认情况下，我如何灰掉下拉字段？

回答

相关问题