保持按钮处于活动状态，直到再次单击答案

【问题标题】：Keep button in active state until clicked upon again保持按钮处于活动状态，直到再次单击
【发布时间】：2014-07-02 22:30:36
【问题描述】：

我觉得我有一个相对简单的问题，我只是不知道该怎么做。我有一个按钮类型的 html 输入标签，它调用一个 javascript onclick 函数。这部分工作正常，但是我希望能够添加到我的 onClick 函数中，使按钮保持处于活动状态的能力（以便在再次单击之前保持突出显示）。

有什么想法吗？我试着把焦点放在它上面，但我认为不可能有多个按钮焦点，这听起来真的很像一个黑客。

【问题讨论】：

你能提供一些你目前尝试过的代码吗？

标签： javascript jquery html css web

【解决方案1】：

你必须使用jQuery的toggleclass功能

<input type='button' onClick="jQuery(this).toggleClass('active')">

检查jsfiddle上的工作代码

【讨论】：

【解决方案2】：

因为你没有代码，我给你一个例子，我希望你有你想要的：

假设这是您的 HTML 按钮：

<div class="button ">My button</div>

让我们给它一些样式

.button { 
float:left;
color: #333;
width: auto;
text-align: center;
padding: 0 10px;
background: #f0f0f0;
line-height: 1.5em;
height: auto;
}

让我们为您的活动按钮设置样式

.button.active {
background: #ea0000;
color: #fff;
}

现在你要做的就是写一个小的jquery函数：

<script>
$('.button').click(function(){
    if($(this).hasClass('active')){
        $(this).removeClass('active')
    } else {
        $(this).addClass('active')
    }
});
</script>

你在这里;-)

这也是我在小提琴上的例子：http://jsfiddle.net/S7kJ2/

保重 ;)

【讨论】：

【解决方案3】：

看来您需要切换功能。

请尝试使用 jQuery toggleClass() 函数：http://api.jquery.com/toggleclass/

【讨论】：