javascript - 单列循环中的禁用按钮

Question

我有 1 行和 3 列。每列有 3 个具有不同 id 的按钮。

示例编号:

--column 1--       --column 2--       --column 3--
id="1morning"      id="2morning"      id="3morning"
id="1evening"      id="2evening"      id="3evening"
id="1afternoon"    id="2afternoon"    id="3afternoon"

*我想使用 id="2evening"

禁用第 2 列中的按钮

我知道如何使用 javascript 禁用按钮，但我不知道如何操作 javascript 以便我可以禁用我想要的按钮。

HTML代码:

<br>
<div class="col-md-9">
  <div class="well.hilang"> 
    <table>
      <tr>
       <?php
       for ($i=1; $i <=3 ; $i++) { 
         ?>
         <td>
           <?php echo $i;?>  
           <div class="form-group">
             <input class="btn btn-l" type="submit" name="submit" id="<?php echo $i;?>morning" ><br>
             <input class="btn btn-l" type="submit" name="submit" id="<?php echo $i;?>evening" ><br>
             <input class="btn btn-l" type="submit" name="submit" id="<?php echo $i;?>afternoon" >
           </div>
         </td>
         <?php }
         ?>
       </tr>
     </table>
   </div>
 </div>

JS代码:

<?php for ($i=1; $i <=3 ; $i++) { ?>
<script>
  document.getElementById("<?php echo $i;?>evening").disabled = true;
</script>
<?php } ?>

问题是所有具有 id="1evening"、id="2evening" 和 id="3evening"< 的列中的 Javascript 禁用按钮。我想要的是仅使用 id="2evening" 禁用按钮。

谢谢，法扎尔

Answer 1

您的选择器不正确。在 document.getElementById(<id here>) ，您只需告诉它您要使用的元素 ID。所以如果你想禁用 2evening按钮，您将执行以下操作:

document.getElementById("2evening").disabled = true;

更多信息:How to disable html button using JavaScript?