javascript - jquery変数が機能しない

Question

div の背景色をフェードさせるコードがいくつかあります。コードは現在、希望どおりに機能していますが、その一部を変数に置き換えて、影響を受ける div を変更できるようにしたいと考えています。影響を与えている div の id は「one」ですが、それを変数の値にして、コードに変数を配置しようとすると、もう機能しません。これを機能させるためにこれを行うことができる別の方法はありますか？コードは次のとおりです。

var temp2 = "one";
$(document).ready(function () {
    $("#temp2").click(function () {
        $("#temp2").animate({
            "opacity": "0.15"
        }, "slow");
    });
});

Answer 1

あなたは近くにいます...これを試してください。

var temp2 = "#one";
$(document).ready(function () {
    $(temp2).click(function () {
        $(this).animate({
            opacity: '0.15'
        },
            "slow");
    });
});

これが実際の例です

または、クラスを使用して、変数を忘れることもできます。

$(document).ready(function () {
    $('.animateMe').click(function () {
        $(this).animate({
            opacity: '0.15'
        },
            "slow");
    });
});

この作業例をご覧ください

また、同じハンドラーを複数の要素で実行する場合は、「id」の配列を作成できます

var arr = ["one", "two", "three", "four", "five"];
$(document).ready(function () {
    // loop through the array
    jQuery.each(arr, function () {
        // create a local variable
        var id = '#' + this;
        $(id).click(function () {
            $(id).animate({
                opacity: '0.15'
            },
                "slow");
        });
    });
});

これが実際の例です