选项标签禁用属性答案

【问题标题】：Option tag disable property选项标签禁用属性
【发布时间】：2019-09-25 19:45:45
【问题描述】：

我有一个<select> 标记部分，如果要禁用这些选项，我想要一些标记部分。我试过同时使用disabled="false" 和disabled="true"

无论我使用哪个，所有选项都显示为禁用。

这是我的代码：

<select className="form-control " onChange={this.drugsChange.bind(this)} value={this.state.drug_type}>
   <option value='-1' disabled="true">Select Medication Class</option>
   <option value='Medication Clause A' disabled="false"> Medication Class A</option>
   <option value='Medication Clause B' disabled="false"> Medication Class B</option>
   <option value='Medication Clause C' disabled="true"> Medication Class C</option>
</select>

我希望药物 A 类和 B 类药物不被禁用

【问题讨论】：

“我在选择标签中有一个选择标签”是什么意思。是嵌套的吗？如果是，您也可以发布该标记吗？
刚刚从您要启用的标签中完全删除了disabled 说明符。例如：.<option value='Medication Clause A'> Medication Class A</option>
Make some options in a select menu "unselectable"的可能重复

标签： html reactjs select

【解决方案1】：

嘿，只需为您想要禁用的那些尝试禁用，而无需提供您不想被禁用的禁用键。

<select className="form-control " onChange={this.drugsChange.bind(this)} value={this.state.drug_type}>
   <option value='-1' disabled>Select Medication Class</option>
   <option value='Medication Clause A'> Medication Class A</option>
   <option value='Medication Clause B'> Medication Class B</option>
   <option value='Medication Clause C' disabled> Medication Class C</option>
</select>

试试这个如果它不起作用你可以给disabled={true}

【讨论】：

我也需要属性为false
去掉disabled就可以了，需要disable false属性
disabled={true} 用于禁用选项， disabled={flase} 用于其他选项。
我试图保持这样显示错误
在 disabled 内部直接使用 this(medicationclassenable) 而不是三元运算符 disabled={medicationclassenable}

【解决方案2】：

工作代码和框example。

disabled 不需要设置布尔值。仅提及它就表明要禁用 option 标签。在反应中，如果你想进行条件检查，你可以做类似

 <select className="form-control">
    <option value="-1" disabled={counter !== 0} selected>
        Select Medication Class
    </option>
    <option value="Medication Clause A" disabled={counter === 0}>
        {" "}
        Medication Class A
    </option>
    <option value="Medication Clause B"> Medication Class B</option>
    <option value="Medication Clause C" disabled={counter === 0}>
        {" "}
        Medication Class C
    </option>
</select>

假设counter 是一个状态变量。

在您目前的情况下，只需禁用即可。

<option disabled selected>
  Select Medication Class
</option>

【讨论】：