Question

某人如何选择一个按钮（不是单选按钮或复选框按钮），而是整个按钮会改变然后改变颜色？这个想法是，有人会选择多个按钮然后提交。

Answer 1

您仍然可以使用复选框，然后使它们看起来像按钮。由于使用了引导程序，因此非常简单。

.cb-btn:checked + label {
  background-color: Green;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<input type="checkbox" id="cb1" hidden class="cb-btn"><label class="btn btn-primary" for="cb1">Foo</label>

<input type="checkbox" id="cb2" hidden class="cb-btn"><label class="btn btn-primary" for="cb2">Bar</label>

<input type="checkbox" id="cb3" hidden class="cb-btn"><label class="btn btn-primary" for="cb3">Bacon</label>

Answer 2

对于每个按钮，您可以添加一个onclick函数，该函数随后将更改button的颜色。

<button onclick = "document.getElementById("myButton").style.backgroundColor = "blue";">Button</button>

选择几个按钮

2 个答案: