如何使用 javascript/jquery 在选择下拉菜单中启用/禁用引导选项

Posted 2023-05-08

【中文标题】如何使用 javascript/jquery 在选择下拉菜单中启用/禁用引导选项

【英文标题】：How to enable/disable bootstrap option in select dropdown using javascript/jquery

【发布时间】：2020-08-30 08:30:46

【问题描述】：

我正在尝试禁用特定选项。这是我的代码

<select id="reportselect" name="r_name"  class="selectpicker mdb-select md-form colorful-select dropdown-secondary" required >
   <option value="" disabled selected>Choose report</option>
   <option value="1">Report 1</option>
   <option value="2">Report 2</option>
   <option value="3">Report 3</option>
   <option value="4">Other Reports</option>
   <option value="5">Final Report</option>
</select>

我找不到任何错误。

<script type="text/javascript">
if(reportshowjs=='1')  
  alert('11111e11111');

  var selectobject;
  selectobject = document.getElementById("reportselect").getElementsByTagName("option");
  selectobject[3].disabled = true;
  $('#reportselect').selectpicker('refresh');

</script>

【参考方案1】：

这是一个 Javascript 示例：

document.getElementById("reportselect").options[3].disabled = true;

请验证这是否适合您。

---

我发布的代码应该可以工作。

坦率地说，您的原始代码也应该可以工作。

我认为“不工作”是选项保持“启用”。

您最好的办法是单步调试调试器，也许将您的表情分解成单独的部分，看看哪个（如果有的话）让您感到悲伤。

示例：

var idx = 3; 
var s = document.getElementById("reportselect");
var o = s.options[idx];
o.disabled = true;
...  
<= Single step through each of these in Chrome Developer Tools,
   ensuring none are ever "null"...

【讨论】：

请在调试器（例如 Chrome 开发工具）下单步调试代码，并在设置“.disabled = true”之前验证您没有遇到“null”。

@Vishva Madumal - 问：您解决了问题吗？您是否单步执行了调试器？出了什么问题/你是如何解决的？