如何在 Jquery 中禁用输入（单选）按钮内的类

Posted 2023-03-27

【中文标题】如何在 Jquery 中禁用输入（单选）按钮内的类

【英文标题】：How to disable Class inside Input(Radio) Button in Jquery

【发布时间】：2019-07-24 06:09:36

【问题描述】：

我需要使用 qusweitstnesel 类名禁用 KG 值单选按钮。这是我的代码

HTML

<li id="field_1_48" class="gfield qusweitstnesel gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible" style="display: list-item;">
<label class="gfield_label">Weight<span class="gfield_required">*</span></label>
<div class="ginput_container ginput_container_radio">
<ul class="gfield_radio" id="input_1_48">
<li class="gchoice_1_48_0">
<input name="input_48" value="KG" id="choice_1_48_0" tabindex="13" disabled="disabled" class="gf-default-disabled" type="radio">
<label for="choice_1_48_0" id="label_1_48_0">KG</label>
</li>
<li class="gchoice_1_48_1">
<input name="input_48" value="Stone" checked="checked" id="choice_1_48_1" tabindex="14" type="radio">
<label for="choice_1_48_1" id="label_1_48_1">Stone</label>
</li>
</ul>
</div>
</li>

jQuery :

var kgs="KG";
jQuery(".qusweitnotsel .ginput_container_radio .gfield_radio li input[type=radio][value='+ kgs +']").attr("disabled","disabled"); 

【参考方案1】：

您必须在[value='"+ kgs +"'] 的单引号内使用双引号。

请注意：您已经在 html 中为单选按钮设置了 disabled 属性。您在代码中使用的类名中也有拼写错误qusweitnotsel....应该是qusweitstnesel

var kgs="KG";
jQuery(".qusweitstnesel .ginput_container_radio .gfield_radio li input[type=radio][value='"+ kgs +"']").attr("disabled","disabled");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<li id="field_1_48" class="gfield qusweitstnesel gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible" style="display: list-item;">
  <label class="gfield_label">Weight<span class="gfield_required">*</span></label>
  <div class="ginput_container ginput_container_radio">
    <ul class="gfield_radio" id="input_1_48">
      <li class="gchoice_1_48_0">
        <input name="input_48" value="KG" id="choice_1_48_0" tabindex="13" class="gf-default-disabled" type="radio">
        <label for="choice_1_48_0" id="label_1_48_0">KG</label>
      </li>
      <li class="gchoice_1_48_1">
        <input name="input_48" value="Stone" checked="checked" id="choice_1_48_1" tabindex="14" type="radio">
        <label for="choice_1_48_1" id="label_1_48_1">Stone</label>
        </li>
    </ul>
  </div>
</li>

您也可以使用Template Literals，它允许嵌入表达式：

var kgs="KG";
jQuery(`.qusweitstnesel .ginput_container_radio .gfield_radio li input[type=radio][value=$kgs]`).attr("disabled","disabled");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<li id="field_1_48" class="gfield qusweitstnesel gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible" style="display: list-item;">
  <label class="gfield_label">Weight<span class="gfield_required">*</span></label>
  <div class="ginput_container ginput_container_radio">
    <ul class="gfield_radio" id="input_1_48">
      <li class="gchoice_1_48_0">
        <input name="input_48" value="KG" id="choice_1_48_0" tabindex="13" class="gf-default-disabled" type="radio">
        <label for="choice_1_48_0" id="label_1_48_0">KG</label>
      </li>
      <li class="gchoice_1_48_1">
        <input name="input_48" value="Stone" checked="checked" id="choice_1_48_1" tabindex="14" type="radio">
        <label for="choice_1_48_1" id="label_1_48_1">Stone</label>
        </li>
    </ul>
  </div>
</li>