保持按钮处于活动状态，直到再次单击为止 [英] Keep button in active state until clicked upon again

问题描述

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

I feel like I have a relatively simple question that I'm just not sure how to go about doing. I have an html input tag of button type which calls a javascript onclick function. This part works fine, however I want to be able to add to my onClick function, the ability to keep the button in the active state (so that it remains highlighted until clicked upon again).

任何想法？我试着把注意力集中在它上面，但我认为它不可能有多个按钮焦点，这听起来真的像黑客。

Any ideas? I tried keeping the focus on it instead, but I don't think its possible to have multiple button focuses, and that really just sounds like a hack.

推荐答案

由于你没有代码我给你举个例子，我希望你有你想要的：

As you have no code i am giving you an example and i hope you have that you want:

假设这是你的HTML按钮：

Let's say this is your HTML button:

<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;
}

让我们设定你的活动按钮的样式

And let's style your active button

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

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

Now that you have to do is to write a small jquery function:

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

这里是你; - ）

以下是小提琴的例子： http://jsfiddle.net/S7kJ2/

Heres my example on fiddle also: http://jsfiddle.net/S7kJ2/

小心;）

这篇关于保持按钮处于活动状态，直到再次单击为止的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！