【Javascript + jQuery】「jQuery」のイベントメソッド「.on」の使い方

.on(events[,selector][,data],handler)
.on(eventsmap[,selector][,data])

.on(イベントの種類,実行する内容)
.on(イベントの種類,実行する対象,実行する内容)
.on(イベントの種類,実行する対象,data],実行する内容)
.on(eventsmap[,selector][,data])

「event」- イベントの種類

複数のイベントを「半角スペース」で区切り、指定することが可能。
・click
・mouseenter
・mouseleave

「selector」- 実行する対象

「HTMLタグ」「ID名」「クラス名」「子要素」などを指定できる。
「data」がある場合は、「selector」に記述は必須。
空の場合は、「null」を指定。

「data」- 「handler」に渡す任意のデータ

「handler」に渡すためのデータを指定する引数。

「handler」- 実行する内容

「function(){実行プログラム}」で指定することで、
一連の処理を記述することができる。
前持って記述してある「関数」を「関数名」で指定できる。

「on(eventsmap[,selector][,data])」のサンプルコード

$("#ID名").on({
mouseenter:function(){
//mouseenterの処理
},
mouseleave:function(){
//mouseenterの処理
}
});

サンプルコード

$("#ID名").on("click",function(){
alert("クリックされました！！");
});

後で追加した要素も含めるイベントアクション書式

$("ul").on("click","li",function(){
$(this).css("backgroundcolor","yellow");
});