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>

你在这里; - ）

继承我的小提琴例子：http://jsfiddle.net/S7kJ2/

小心;）

Answer 2

你必须使用jQuery的toggleclass功能

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

检查jsfiddle

上的工作代码

Answer 3

您似乎需要切换功能。

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

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

3 个答案: