Question

我需要帮助。我有这个结构

<div class="buttons">
<p onclick="function1('param1')">button1</p>
<p onclick="function2('param2')">button2</p>
<p onclick="function3('param3')">button3</p>
</div>

此代码完美无缺，但另外我需要将class =“active”添加到当前所选按钮，这是我无法做到的。以下代码不起作用。

$(document).ready(function() {
$('.buttons').click(function(){
if($(this).hasClass('active')){
return false;
}
else{
$('.buttons > p').removeClass('active');
$(this).addClass('active');
}
});
})

有谁能说如何解决这个问题？

Answer 1

你输错了

<div class="buutons">

应该是

<div class="buttons">

另外

<p onclick="function3('param3')>button3</p>

应该是

<p onclick="function3('param3')">button3</p>

JSFiddle是here。

Answer 2

删除p元素上的onclick属性，它将覆盖你在js代码中注册的监听器，而不是在js代码中注册它。

更改代码，在第一个选择器中添加“＆gt; p”：

$(document).ready(function() {
$('.buttons > p').click(function(){
if($(this).hasClass('active')){
return false;
}
else{
$('.buttons > p').removeClass('active');
$(this).addClass('active');
}
});
})

使用Jquery切换按钮

2 个答案: