Question

我在div的内部有3个按钮，如下所示。

<div id="make_larger">
<button type="button">Large</button> 
</div>
<div id="make_small">
<button type="button">Smaller</button> 
</div>
<div id="make_normal">
<button type="button">Normal</button> 
</div>

我希望当我点击“大”按钮时，它的颜色应该变为蓝色（使用.selected类的css为它）.Jquery代码如下。

$('#make_larger').bind('click', function () {
        $('body').addClass('large');
        $('body').removeClass('normal');
        $('body').removeClass('smaller');
        $(this).addClass('selected');

     });

但它不起作用。色彩不会改变。为什么呢？

请帮助。

Answer 1

将最后一行更改为

$(this).children('button').addClass('selected');

Answer 2

<强> HTML

<div id="make_larger">
    <button type="button">Large</button>
</div>
<div id="make_small">
    <button type="button">Smaller</button>
</div>
<div id="make_normal">
    <button type="button">Normal</button>
</div>
<style type="text/css">
    .selected{background:blue}
</style>

<强> JQUERY

$('#make_larger').click(function() {
     $('#make_larger button').addClass('selected');
});

DEMO http://jsfiddle.net/mRwMt/10/

Answer 3

你给包含div的类选择了，而不是按钮。看到这个jsfiddle：http://jsfiddle.net/AFNJ9/。

你可以用css做点什么： .selected button {background:blue;}会使按钮背景为蓝色。

在我的选择中，使用'on'是很好的：What's the difference between `on` and `live` or `bind`?

JQuery代码无法点击按钮？

3 个答案: