Question

如何禁用optgroup中的某些项

我想禁用“--Pick Up--”和“ - 所有位置 - ”我正在使用drorpdwon

<select name="ddlpickuplocation" id="ddlpickuplocation" tabindex="1" class="width320">
<optgroup label="california">
<option value="--Pick Up--">--Pick Up--</option>
<option value="LOS ANGELES AIRPORT  (LAX)">LOS ANGELES AIRPORT  (LAX)</option>
<option value="SAN DIEGO AIRPORT  (SAN)">SAN DIEGO AIRPORT  (SAN)</option>
<option value="SAN FRANCISCO AIRPORT  (SFO)">SAN FRANCISCO AIRPORT  (SFO)</option>
<option value="--All locations--">--All locations--</option>
<option value="ANAHEIM DOWNTOWN">ANAHEIM DOWNTOWN</option>
<option value="BATON ROUGE INTERNATIONAL AIRPORT">BATON ROUGE INTERNATIONAL AIRPORT</option>
<option value="BERKELEY DOWNTOWN">BERKELEY DOWNTOWN</option>
<option value="SAN JOSE AIRPORT">SAN JOSE AIRPORT</option>
<option value="SANTA BARBARA AIRPORT">SANTA BARBARA AIRPORT</option>
</optgroup>
<optgroup label="florida">
<option value="BOCA RATON AIRPORT">BOCA RATON AIRPORT</option>
<option value="CLEARWATER AIRPORT">CLEARWATER AIRPORT</option>
<option value="DAYTONA AIRPORT">DAYTONA AIRPORT</option>

</optgroup>


</optgroup>
<optgroup label="rest of usa">
<option value="--Pick Up--">--Pick Up--</option>
<option value="CHICAGO OHARE AIRPORT  (ORD)">CHICAGO OHARE AIRPORT  (ORD)</option>
<option value="--All locations--">--All locations--</option>
<option value="AKRON AIRPORT">AKRON AIRPORT</option>
<option value="ALLENTOWN AIRPORT">ALLENTOWN AIRPORT</option>
<option value="ALLENTOWN DOWNTOWN">ALLENTOWN DOWNTOWN</option>
<option value="AMARILLO AIRPORT">AMARILLO AIRPORT</option>
<option value="ANCHORAGE AIRPORT">ANCHORAGE AIRPORT</option>
<option value="ANDERSON DOWNTOWN">ANDERSON DOWNTOWN</option>
<option value="APPLETON AIRPORT">APPLETON AIRPORT</option>
<option value="ARKANUS AIRPORT">ARKANUS AIRPORT</option>
<option value="ATLANTA AIRPORT">ATLANTA AIRPORT</option>
</optgroup>
<optgroup label="western usa">
<option value="ALBUQUERQUE AIRPORT">ALBUQUERQUE AIRPORT</option>
<option value="ASPEN AIRPORT">ASPEN AIRPORT</option>

</optgroup>

Answer 1

使用属性选择器[]

试试这个

$('option[value="--Pick Up--"]').prop('disabled',true);
$('option[value="--All locations--"]').prop('disabled',true);

Answer 2

为这些选项添加disabled属性：

<option value="--Pick Up--" disabled>--Pick Up--</option>

修改

如果你想用JavaScript做，你可以像bipen在his answer
那样做
$('#ddlpickuplocation option[value="--Pick Up--"]').prop('disabled',true); $('#ddlpickuplocation option[value="--All locations--"]').prop('disabled',true);

但是，默认情况下第一次选择第一个选项，因此您还可以添加代码来更改初始选择。检查working fiddle。

Answer 3

如果您不希望由于样式而禁用选项，请再次使用optgroup。像

这样的东西

<select>
   <optgroup label="rest of usa">
        <optgroup label="--Pick Up--"></optgroup>
        <option value="CHICAGO OHARE AIRPORT  (ORD)">CHICAGO OHARE AIRPORT  (ORD)</option>
        <option value="--All locations--">--All locations--</option>
        <option value="AKRON AIRPORT">AKRON AIRPORT</option>
   </optgroup>
</select>

如何在optgroup中禁用某些项目

3 个答案: