当 php 在 while 循环中显示按钮时，使用 js 更改按钮的类

Question

`<?php$i = 0;$testcount = 0;while($testcount < 8) {  if($i == 0) {    ?>    <input id="info" type="hidden" value="hi">    <?php  } else if ($ == 1) {    ?>    <input id="info" type="hidden" value="test">    <?php  }  ?>  <button onclick="test()" class="btnT">Hello</button>  <?php  $testcount++;}?><style>  .test1 {     background-color: cyan;     color: black;  }</style><script type="text/javascript">  function test () {     $(".btnT").addClass("test1");  }</script>`忽略if语句，我还没有实现到js我正在使用 php while 循环显示按钮，没有任何文本或类。使用 if 语句使用 php 确定一个类，它们将保存一个隐藏的输入值，然后将其推送到 javascript，然后根据隐藏输入的值添加一个类，然后我试图删除并添加另一个类在 while 循环中只显示一个单独的按钮。我要么获得第一个按钮来获得更改，要么它更改所有按钮，而不是我单击的单个按钮。请帮忙，谢谢！我最大的问题是如何让 while 循环内的每个按钮都单独发生事件，而不是全部发生。我知道这是因为我有向按钮类添加类的代码，我尝试用 id 替换按钮类，但那样的话，只有第一个按钮会添加新类，而不是其余按钮. 希望每个按钮都有一个解决方案来单独行动

Answer 1

当您创建 while 循环时，您可以将 $testcount 附加到按钮 ID 的末尾，这样每个按钮都会有自己唯一的 ID，但仍然有一个可以在 javascript 中使用的“模板”名称。

<?php

$i = 0;

$testcount = 0;

while($testcount < 8) {

  echo '<button id="btn'.$testcount.'" onclick="test('.$testcount.')" class="btnT">Hello</button>';

  $testcount++;

}

?>

之后你应该得到 7 个按钮，ID 为 btn1、btn2、btn3、btn4 等

然后在 Javascript 中，您可以像这样基于每个按钮运行一个函数：

function test(x) {

    var myButton = document.getElementById('btn' + x);

    myButton.classList.add("test1");

    // Any more JS logic you have

}

例如，当您单击按钮 #2 时，该按钮的 ID 应为“btn2”。单击按钮会将数字“2”作为参数发送给 JS 函数。变量 myButton 将通过 btn 的 ID + 你给它的数字来创建一个像'btn2'这样的字符串，然后基于你现在知道按下了哪个按钮，你就可以基于它运行操作. 使用您的示例，您将类“test1”添加到该按钮。