前言：
眼前你们对“js的on方法”可能比较关怀，兄弟们都需要分析一些“js的on方法”的相关知识。那么小编在网上汇集了一些有关“js的on方法””的相关知识，希望你们能喜欢，各位老铁们快快来学习一下吧！//on(eve, [sel], [data], fn) 1.7 + 在选择元素上绑定一个或多个事件的事件处理函数。
1可以多次添加相同的点击事件
$("p").on("click", function() { console.log(1); });
$("p").on("click", function() { console.log(2); });
2可以在某个对象上同时添加多个事件处理函数
$("button").on({
click: function() { $("p").slideToggle();},
mouseover: function() {$("body").css("background-color", "red");},
mouseout: function() {$("body").css("background-color", "#FFFFFF");}
});
3通过on事件可以通过冒泡原理实现事件委托。
<script src="js/jquery.js"></script>
<div id="box" style="width:200px,height:200px,background:red">
<div id="littleBox" style="width:50px,height:50px,background:blue">内层div</div>
<div id="otherBox" style="width:50px,height:50px,background:green"></div>
</div>
<div id="msg"></div>
<script>
$(function () {
$("#box").on("click","#littleBox",function(){
$("#littleBox").css("background","black")})})
</script>
4移除on中的事件处理函数
$("p").off(); //移除所有的事件；$("p").off("mouseover mouseout");移除参数事件函数
标签： #js的on方法
