如何更改具有相同类的单击事件上动态创建的 div 的颜色？答案

【问题标题】：How to change the Color of dynamically created divs on click event, who are having same class?如何更改具有相同类的单击事件上动态创建的 div 的颜色？
【发布时间】：2013-10-29 07:09:08
【问题描述】：

如何在点击事件中更改动态创建的 div 的颜色，谁具有相同的类？

$(this).css('color', 'pink');这样我们就可以改变点击的 div 颜色了。

但我想将点击的颜色更改为粉红色，并将剩余的 div 颜色更改为黑色。

有什么提示吗？

参考代码：

$('#main_div').on('click','class1', function(){
  $(this).css('color','pink');       
});

我有三个具有“class1”类的 div。当我点击一个 div 时，那个 div 应该变成粉红色，其他的应该是黑色。

【问题讨论】：

你试过 .on() 了吗？ See here

标签： javascript jquery css

【解决方案1】：

试试这个，

DEMO

代码：

  $("#main_div").on("click", ".class1", function () {
        $(this).css("color", "red");
        $(".class1").not(this).css("color", "black");
    });

【讨论】：

【解决方案2】：

试试这样的，FIDDLE

CSS

    .clrs{
            height:100px;
            width:100px;
            background-color: green;
            margin-bottom: 10px;
        }

JAVASCRIPT

        $(function(){
            $('.clrs').click(function(){
                $('.clrs').css('background-color','black');
                $(this).css('background-color','pink');
            })
        })

HTML

    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>
    <div class="clrs"></div>

【讨论】：

【解决方案3】：

像这样尝试 .on() ：

$('body').on('click','div.yourclassname',function(){
    $(this).css('color', 'pink');
})

【讨论】：

我认为他需要更改 'background-color' css 属性。

【解决方案4】：

试试这个：

$("#div").on("click",".red",function(){
    $(this).css("color","pink");
});

Here is the fiddle

【讨论】：

【解决方案5】：

试试这样：

$('#main_div').on('click','class1', function(){
  $('.class1').css('color','black').eq($(this).index()).css('color', 'pink');       
});

【讨论】：