Question

这里有什么问题？在我的最后尝试了一切，但似乎没有任何工作

<div class="main">
    <div class="qty" style="float:left">1</div>
    <div class="name" >A</div>    
</div>
<div id="main">
    <div class="qty" style="float:left">2</div>
    <div class="name">B</div>    
</div>
<input type="button" id="ADD">


$('#main').on('click', function(){
        $(this).addClass('selected');
    });
$('.name').on('click', function(){
        $(this).addClass('selected');
    });
$('.qty').on('click', function(){
        $(this).addClass('selected');
    });

$('#ADD').click( function(){
        $(".selected").nearest(".qty").text($(".selected").nearest(".qty").text() +1);
    });

Answer 1

如果问题是您的第二个<div id="main">没有获得selected类，那是因为您在DOM上不能有多个项目具有与{{3}中相同的ID }}

将main更改为一个类，它将按预期工作。

<强> HTML

<div class="main">
    <div class="qty" style="float:left">1</div>
    <div class="name" >A</div>    
</div>
<div class="main">
    <div class="qty" style="float:left">2</div>
    <div class="name">B</div>    
</div>
<input type="button" id="ADD">

<强> JS

$('.main').on('click', function(){
    $(this).addClass('selected');
});

<强> your jsfiddle example

Answer 2

您的代码正在尝试为每个单击的元素添加CSS类。如果要添加类属性，请执行以下操作：

$('#main').on('click', function(){
    $(this).attr('class', 'selected');
});

如果要应用CSS类，请在样式标记

中创建所选类

<style>
    .selected {
        color: blue;
    }
</style>

然后使用

将其添加到点击的元素中

.addClass("selected");

尝试动态更改div的类时，addClass不工作

2 个答案: