JS中select框中控制下拉列表部分可选部分不可选_js option 某个不可选-优快云博客

本文介绍如何在JavaScript中处理select元素，使得部分选项显示但不可选，当用户尝试选择这些灰色显示的选项时，会自动跳转回'请选择'的选项。通过设置样式和点击事件实现这一功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近在业务需求开发中，需要对结汇资金属性的下拉选项进行控制。需求原本是要求对于不可选的属性，用户点击后默认显示请选择。修改完成后，需求又变更为还是让属性显示出来，另外在别的地方去控制流程终止。哎，对业务的需求变更是最无力吐槽了，。最疯狂的遇到过，对于一个需求一天变一次，连续改了三个版本，真是累死宝宝了。

现在给大家提供最初的需求，不可选的属性置灰，用户点击后默认回到请选择的属性。

先把html代码贴一下：

<td align="left" class="Tip_Content">
<select id="text_fxAttribute" class="input_long13" onchange="javascript:checkOptValue()">
<option id="oPlsChoose" value="999"></option>
<option value="666" style="color:gray" id="oCargoTrade"></option>
<option value="666" style="color:gray">运输</option>
<option id="oTravel" value="122"></option>
<option value="666" style="color:gray">金融和保险服务</option>
<option value="666" style="color:gray">专有权利使用费和特许费</option>
<option id="oReferService" value="125"></option>
<option value="666" style="color:gray">其他服务</option>
<option value="131" style="color:gray">职工报酬和赡家款</option>
<option value="666" style="color:gray">投资收益</option>
<option value="666" style="color:gray">其他经常转移</option>
<option value="666" style="color:gray">资本账户</option>
<option value="666" style="color:gray">投资资本金</option>
<option value="666" style="color:gray">直接投资撤资</option>
<option value="666" style="color:gray">房地产</option>
<option value="666" style="color:gray">其他直接投资</option>
<option value="666" style="color:gray">对境外证券投资撤回</option>
<option value="666" style="color:gray">证券筹资</option>
<option value="666" style="color:gray">其他投资</option>
<option value="666" style="color:gray">国内外汇贷款</option>
<option value="270">经批准的资本其他</option>
</select>
</td>

selected框选择事件的控制。value值为666的点击后默认显示请选择。

function checkOptValue(){
if(document.getElementById("text_fxAttribute").value == "666") {
document.getElementById("text_fxAttribute").options[0].selected=true;

return；

｝

在select标签中加入onchange="javascript:checkOptValue()"即可实现。谢谢参阅。