jquery - クリック時の JQuery addClass

Question

ボタンをクリックしたときに、JQueryを使用してクラスをボタンに追加しようとしています。次のコードは、クラスと JQuery onclick イベントとそのハンドラーを示しています。

CSS

.input-highlight {
     background-color: #1E90FF;
     color: white;
}

JS

$("#elv-geo").on("click", hightlight);

function hightlight() {

    var georgian = $("#geo-elv");

    georgian.addClass("input-highlight");

}

クラスに「可視性：非表示」があったときは機能しましたが、上記のコードでは機能しません。理由はありますか？

Answer 1

あなたは何度 $("#geo-elv")も使いました$("#elv-geo")。これにより、問題が発生する可能性があります..

また、次の構文の使用を検討する必要があります。

$("#geo-elv").on('click',function(){
    $(this).addClass('input-highlight');
})

Answer 2

.input-highlight {
    background-color: #1E90FF;
    color: white;
}

var id = "#elv-geo"; // is it elv-geo or geo-elv?
$(id).on("click", highlight);

function highlight() {
    $(id).addClass("input-highlight");
}