Question

我的视图中有三个按钮。我希望按钮不仅可以在单击期间突出显示，还可以发布单击（除非再次单击）。我知道如何在点击时突出显示按钮，但我希望突出显示持续到新的点击为止。有办法吗？

Answer 1

这是一个应该在纯CSS中做的小提琴。您将无法使用实际按钮。但你可以设置标签样式，因为我必须看起来像按钮。

注意：这在旧版浏览器（如IE8）

中无效

<强> HTML

<input type="radio" name="Button" class="ButtonState" checked id="Button1" value="1"/>
<label class="Button" for="Button1">Button 1</label>
<input type="radio" name="Button" class="ButtonState" id="Button2" value="2"/>
<label class="Button" for="Button2">Button 2</label>
<input type="radio" name="Button" class="ButtonState" id="Button3" value="3"/>
<label class="Button" for="Button3">Button 3</label>

<强> CSS

.ButtonState{display:none}
.Button{padding:3px; margin:4px; background:#CCC; border:1px solid #333; cursor:pointer;}
.ButtonState:checked + .Button{background:#fff;}

Answer 2

Jquery版本

HTML

<button onclick=Highlight(this)/>

JQuery的

function Highlight(button) {
   $(".Highlight").removeClass("Highlight");
   $(button).addClass("Highlight");
}

CSS按钮突出显示发布后点击

2 个答案: