javascript - HTML - 如何在 OnClick 事件中更改按钮背景颜色

Question

我有以下 PHP 代码，其中 4 个按钮从数据库表中动态显示。根据点击的按钮在页面上显示不同的内容。

现在，我想在单击第一个按钮时执行此操作，然后应更改按钮 bg 颜色，以便访问者可以知道按下了哪个按钮。单击第二个按钮时，应更改该按钮的 bg 颜色，并且应将先前单击的按钮(本例中的第一个按钮)恢复为原始颜色。

请告诉我使用 CSS 或 Javascript 执行此操作的最简单方法。

<form name="frm_list" action="toptipper.php" method="post" enctype="multipart/form-data">

<?php 
while(!$rs_tab_list->eof())
{
?>

<button type="submit" name="btn_tab" value="<?php print($rs_tab_list->fields("tabpkid")); ?>"><?php print($rs_tab_list->fields("title")); ?></button>

<?php  
$rs_tab_list->movenext();
}       
?>

</form>

Answer 1

如果您只想一次选择一个，请取消注释掉注释标记。

$('button').on("click",function(){  
  //$('button').not(this).removeClass();
  $(this).toggleClass('active');
  
  });

.active{background-color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>1</button>
<button>2</button>
<button>3</button>