javascript - 保持按钮处于事件状态，直到再次点击

Question

我觉得我有一个相对简单的问题，只是不确定如何着手去做。我有一个按钮类型的 html 输入标签，它调用一个 javascript onclick 函数。这部分工作正常，但是我希望能够添加到我的 onClick 函数中，使按钮保持事件状态的能力(以便它在再次单击之前保持突出显示)。

有什么想法吗？我试着将注意力集中在它上面，但我认为不可能有多个按钮焦点，这听起来真的很糟糕。

Answer 1

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

假设这是您的 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>

你在这里 ;-)

这也是我在 fiddle 上的例子:http://jsfiddle.net/S7kJ2/

保重;)