Question

我在.box中有多个.color_container个元素。我已经编写了这个函数，所以当我点击其中一个框时，我可以改变它的背景颜色。一个盒子可以正常工作，但是当我点击另一个盒子并改变它的颜色时，我点击的所有其他盒子也会受到影响。

我只想改变我刚刚点击的盒子的颜色。这是我的代码。非常感谢您提供任何帮助。

function defineColor(){
$(".color_container .box").click(function(){
    var boxToModify = $(this);

    if( $(this) .hasClass("plus") ){
        $(this) .css("background-color", "rgb(255, 255, 255)")
                .removeClass("plus")
                .contents().remove();
    };

    var rgb = $(this).css("background-color").match(/\d{1,3}/g);        
    $("#box_r input").val(rgb[0]);
    $("#box_g input").val(rgb[1]);
    $("#box_b input").val(rgb[2]);

    $(".box input").keyup(function(event){

        var value = $(this).val();

        if(value > 255 || isNaN(value) ){
            alert("Error! Input must be a number 255 or less.");
        }else if( value >= 0 && value <=255){
            var r = $("#box_r input").val();
            var g = $("#box_g input").val();
            var b = $("#box_b input").val();
            var output = "rgb(" + r + ", " + g +", " + b + ")";

            $(boxToModify).css("background-color", output);
        };
    });
});

};

Answer 1

您可能想要更改此内容：

$(".box input").keyup(function(event){

到此：

$(this).find('input').off('keyup').on('keyup', function(event) {

每次单击一个框时，您都会将一个keyup事件绑定到该类的所有框。

当我只想更改一个时，会影响多个ID（javascript＆amp; jquery）

1 个答案: