JSLite - 事件处理


如有疑问欢迎到这些地方交流，欢迎加入JSLite.io组织团伙共同开发！

blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error 对象上直接添加事件。blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error 对象上直接添加事件。

$("#box").click(function(){
    console.log("绑定点击事件")
});

ready

ready(function($){ ... })   ⇒ self
添加一个事件侦听器，当页面 dom 加载完毕 DOMContentLoaded 事件触发时触发。加载完毕执行，建议使用 $(func) 来代替这种用法。

$(document).ready(function(){
    alert("当页面dom加载完毕执行");
    console.log($("#box"));
})

$(func)

加载完毕执行。与 ready 方法相同

//或者使用下面方法代替ready$(function(){    console.log("当页面dom加载完毕执行");
})

bind

为每个匹配元素的特定事件绑定事件处理函数。可以绑定这些事件 blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error  paste drop dragover 。

$("#box").bind("click", function(){
    console.log("绑定点击事件")
});

unbind

解除绑定事件，从每一个匹配的节点对象中删除绑定的事件。

var f1=function(){alert("41");}
$("#box").bind("click",f1)   //⇒ 绑定事件
$("#box").unbind("click",f1) //⇒ 解除绑定事件

$("#box").bind("click",function(){alert("41");})   //⇒ 绑定事件
$("#box").unbind("click",function(){alert("41");}) //⇒ 解除绑定事件

on

on(type, [selector], function(e){ ... }) ⇒ self
on({ type: handler, type2: handler2, ... }, [selector]) ⇒ self
为每个匹配元素的特定事件绑定事件处理函数。可以绑定这些事件 blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error  paste drop dragover

$("#box").on("click", function(){
    console.log("绑定点击事件")
});

$("#box").on("click mouseover",function(evn){
    console.log("2"+evn)
}) //⇒ self  绑定两个事件

$("#box").on("click","p",function(){
    console.log("被点击了")
})//⇒ self  返回“#box”节点

$("#box").on("click",{val:1},function(){//传参数
    console.log("dddd","event.data.val = " + event.data.val)
})

$( "#box" ).on({ //绑定多个事件
    click: function() {
        $( this ).css("background","red");
    }, 
    mouseover: function() {
        $( this ).css("background","yellow")
    },
    mousedown: function() {
        $( this ).css("background","green")
    }
});
ready

ready(function($){ ... })   ⇒ self
添加一个事件侦听器，当页面 dom 加载完毕 DOMContentLoaded 事件触发时触发。加载完毕执行，建议使用 $(func) 来代替这种用法。

var f1=function(){alert("41");}
$("#box").on("click",f1)   //⇒ 绑定事件
$("#box").off("click",f1) //⇒ 解除绑定事件

$("#box").on("click",function(){alert("41");})   //⇒ 绑定事件
$("#box").off("click",function(){alert("41");}) //⇒ 解除绑定事件
🎜$(func)🎜🎜🎜加载完毕执行。与 ready 方法相同🎜🎜
$("#box").on("abc:click",function(evn,a,c){
    console.log("2"+a+c)
}) //⇒ self  绑定一个事件
$("#box").trigger("abc:click",["wwww"]) //⇒ self 触发并传一个参数进去
🎜bind🎜🎜🎜为每个匹配元素的特定事件绑定事件处理函数。可以绑定这些事件 blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error  paste drop dragover 。🎜🎜rrreee🎜unbind🎜🎜🎜解除绑定事件，从每一个匹配的节点对象中删除绑定的事件。🎜🎜rrreee🎜on🎜🎜🎜on(type, [selector], function(e){ ... }) ⇒ self
on({ type: handler, type2: handler2, ... }, [selector]) ⇒ self
为每个匹配元素的特定事件绑定事件处理函数。可以绑定这些事件 blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error  paste drop dragover 。🎜🎜rrreee🎜off🎜🎜🎜解除绑定事件，从每一个匹配的节点对象中删除绑定的事件。🎜
rrreee

trigger

trigger(event, [args])   ⇒ self
匹配到的节点集合的元素上触发指定的事件。如果给定args参数，它会作为参数传递给事件函数。

rrreee