如何在jquery中启用/禁用特定表

How to enable/disable specific table in jquery?

本文关键字：启用 jquery      更新时间：2023-09-26

我在一个表格中有两个表。我使用 jquery 分别启用/禁用两个表的文本字段。但是当我单击一个收音机时，它会启用/禁用两个表格文本。请帮忙。一部分代码：

<div class="inputradio1">
  <input type="radio" id="radio" required="required" class="detailradio1" name="select1" Value="Yes" />Option 1<br/>
  <input type="radio" id="radio1" required="required" class="detailradio1" name="select1" value="No" />Option 2 
  </div>
 <script type="text/javascript">
         $("table :text").prop("disabled", true);
         $(".inputradio1 input[name=select1]").change(function () {
             $("table :text").prop('disabled', $(this).val() === 'No');
         });
</script>
<table>
    here is some text fields
</table>

<div class="inputradio2">
    <input type="radio" id="rad" required="required" class="detailradio2" name="select2" Value="Yes" />Fill<br/>
    <input type="radio" id="rad1" required="required" class="detailradio2" name="select2" value="No" />Leave <br/>
 </div>
<script type="text/javascript">
    $("table :text").prop("disabled", true);
    $(".inputradio2 input[name=select2]").change(function () {
       $("table :text").prop('disabled', $(this).val() === 'No');
    });
</script>
<table>
  here is some text fields
</table>

问题是，如果我单击第一个表的第一个单选按钮"选项 1"，它将启用两个表的文本字段，如果我单击第一个表的第一个单选按钮"选项 2"，它将禁用两个表的文本字段。我想做同样的事情，但分开。

你应该给你的表类或ID值结束，然后通过它们添加prop。 

 <div class="inputradio1">
  <input type="radio" id="radio" required="required" class="detailradio1" name="select1" Value="Yes" />Option 1<br/>
  <input type="radio" id="radio1" required="required" class="detailradio1" name="select1" value="No" />Option 2 
  </div>
 <script type="text/javascript">
         $("table#table1 :text").prop("disabled", true);
         $(".inputradio1 input[name=select1]").change(function () {
             $("table#table1 :text").prop('disabled', $(this).val() === 'No');
         });
</script>
<table id='table1'>
    here is some text fields
</table>

<div class="inputradio2">
    <input type="radio" id="radio" required="required" class="detailradio1" name="select2" Value="Yes" />Fill<br/>
    <input type="radio" id="radio1" required="required" class="detailradio1" name="select2" value="No" />Leave <br/>
 </div>
<script type="text/javascript">
    $("table#table2 :text").prop("disabled", true);
    $(".inputradio2 input[name=select2]").change(function () {
       $("table#table2 :text").prop('disabled', $(this).val() === 'No');
    });
</script>
<table id="table2">
  here is some text fields
</table>

if(condition==true)
{$("#table1 :input").each(function () {
$(this).attr("readonly", true);  // make read only
});    
  
$("#table2 :input").each(function () {  
$(this).attr("disabled", true);  // make disable 
});
} else {
$("#table1 :input").each(function () {
$(this).attr("readonly", false);
});
$("#table2 :input").each(function () {
$(this).attr("disabled", false);
});
}
相关文章：