JS插件晋升

2017-03-03  本文已影响0人  f4c03c046d4b

javascript变量规范

data()方法的使用

向元素附加数据

$("div").data("key","value");

取出数据

$("div").data("key");

使用对象向元素附加数据

var obj = {"a":1,"b":{"c":2}};
$("p").data(obj);
console.log($("p".data("a")));
console.log($("p").data("b").c);

bind()方法

描述:向已存在的匹配元素添加一个或多个事件处理器。

$(selector).bind(event,data,function)

参数详解:

参数名     是否必须      说明
---------------------------------------------------------------------------------------------------------------
event       必须              添加到元素的一个或多个事件,例如click,dblclick等
data         可选              需要传递的参数
function    必须              当绑定事件发生时,需要执行的函数                 

单个事件处理

//简单的处理
$(".btn").bind("click",function(){
  //  todo
})
//封装过的
function hehe(event){
  console.log(event.data.foo);
}
$(".btn").bind("click",{foo:'abc'},hehe);

多个事件处理

···
//空格相隔
$(".btn").bind("click mouseout",function(){
// todo
})
//大括号替代方式
$(".btn-test").bind({
"mouseout": function () {
alert("这是mouseout事件!");
},
"click": function () {
$(".container").slideToggle();
}
});

//删除事件处理
$(".btn").unbind("click");
···

on()方法

描述:支持未来新添加元素的事件设置,childselector,data可选

//单事件处理
$(selector).on("click",childselector,data,function);
//多事件处理
//空额分隔多事件
$(selector).on("click dbclick",childselector,data,function);
//大括号定义
$(selector).on({event1:function,event2:function,...},childselector);
//删除事件
$(selector).off("event","childselector");

typeof 的使用

上一篇下一篇

猜你喜欢

热点阅读