Javascript 如何通过复选框隐藏和显示我的div

在下面的代码中，我不知道这里有多少行是动态的。首先我们要把所有的div隐藏起来。当我选中（//第一次输入）复选框后，只有它的div应该可见。

<?php 
    $checkboxid=0;
    foreach($products as $product){ 
        $checkboxid = $checkboxid+1;
?>
    <tr>
       <td class="text-center">
          //first input<input name="checkbox[]" type="checkbox" value="<?php echo $product['id'];?>" id="<?php echo $checkboxid; ?>"><br/>              
          <div class="<?php echo $checkboxid; ?>">
              <input name="chile" type="checkbox" value="" ><br/>
              <input name="miami" type="checkbox" value="" >
          </div>
       </td>
    </tr>
<?php } ?>

//首次输入
你可以这样做

使用类可以轻松实现，如下所示：

<input name="checkbox[]" type="checkbox" value="<?php echo $product['id'];?>" id="<?php echo $checkboxid; ?>" class="myCheckBox">

<div class="<?php echo $checkboxid; ?> myDiv">
    <input name="chile" type="checkbox" value="" ><br/>
    <input name="miami" type="checkbox" value="" >
</div>

为了获得更好的方法，请将类放入相应的div中，如下所示：

<input name="checkbox[]" type="checkbox" value="<?php echo $product['id'];?>" id="<?php echo $checkboxid; ?>" class="myCheckBox">

<div class="<?php echo $checkboxid; ?> myDiv">
    <input name="chile" type="checkbox" value="" ><br/>
    <input name="miami" type="checkbox" value="" >
</div>

已更新

我不知道有多少行，所以我们不能使用任何静态id或类

在这种情况下，
class
适合您

使用jquery show（）和hide（）检查复选框id，如果选中，则显示或隐藏，反之亦然根据您的要求请仔细阅读问题，我不知道有多少行，因此我们不能使用任何静态id或类。请澄清您的问题。嗨，Ghazali，请仔细阅读问题，我不知道有多少行，所以我们不能使用任何静态id或类。为什么mate，class用于多个元素，甚至共享相同的名称，但我们用$（this）来区分它，它代表当前单击的复选框。请参阅随附的演示，所有表行都具有相同的结构。我并没有给出使用静态id的示例，而是在动态播放内容时使用class cause，为其设置更多套件。如果您不太确定，请再次查看更新的演示。我动态生成表行（就像我们不知道有多少行存在一样）嗨，Arijit，请仔细阅读问题，我不知道有多少行，所以我们不能使用任何静态id或类。我不这么认为，当您使用foreach循环时，请确保为它们分配id或至少一个类
$(document).on('change', '.myCheckBox', function () {      
  if ( this.checked ) $(this).nextAll('.myDiv').show();
  else  $(this).nextAll('.myDiv').hide();
});