jQuery

1. 选择器

基本选择器

$('#one').css('background','#000');

//id 选择器

$('.one').css('background','#000');

//css 选择器

$('p').css('font-size','12px');

//element 选择器

$('form *').css('background','#000');

//遍历

并列选择器

略。。

层次选择器

略。。

过滤选择器

略。。

2. 事件处理

2.1 页面载入完毕响应事件

$(document).ready() 

2.2 绑定与反绑定事件监听

绑定事件

$('#id').bind(type,[data],fn)

//type：事件类型

//[data]：可选，作为event.data 属性值传递给fn 的实参

//fn：绑定到事件上的函数

//例：

$('#name').bind('click',{first:'1',second:'2'},function(event){

if(event.data.first == '1'){alert('Hello')};

if(event.data.second== '2'){alert('World !')};

});

//event 参数来自事件绑定函数，event.data 属性包含当前执行的处理程序被绑定时传递到事件方法的可选数据

$('form').bind('submit',function(){

return false;

})

//有时bind 绑定的函数会与浏览器默认的操作冲突，这时如果想阻止浏览器默认的操作，只需在fn 后面加一句return false；

反绑定事件

解除与某元素的某事件绑定在一起的某函数

unbind([type],[fn 名])

//type：事件类型

//fn 名：要被接触绑定的函数名Fuction

//以上两个参数都是可选参数，如果参数是空，就是解除所有匹配元素的所有事件绑定的函数

$('#btn1').click(function(){

$('input[type=text]').unbind();

})

//单击btn1 后，解除所有type=text 文本框的事件绑定的所有函数

一次性绑定

one(type,[data],fn)

//type：事件类型

//[data]：可选，作为event.data 属性值传递给fn 的实参

//fn：绑定到事件上的函数

//one里的fn 只被执行一次

2.3 事件触发器

trigger(type,[data])

//type：事件类型

//[data]：可选，传递给所触发的时间所绑定的函数的实参Array（是一个javascript 数组）触发所匹配的元素的某类事件所绑定的所有函数

2.4 事件交互处理

hover：鼠标悬停

hover(over,out)

//over：鼠标移到元素上触发的函数

//out：鼠标移出元素出发的函数

toogle：多次单击的循环响应

toogle(fn1,fn2,fn3)

//fn1,fn2,fn3 要循环的函数

2.5 内置事件类型

内置事件函数的两种声明方式

$('#id').click();

//不带参数的事件函数，模拟了用户操作，即不单击#id 也会执行点击操作

$('#id').click(function(){});

//点击后执行相应函数

其它，略。。

3. jQuery Ajax

$(selector).load(url,[data],fn)

//url：希望加载的地址

//[data]：可选，发送至服务器的key/value 数据

//fn：可选，回调函数

$.get(url,[data],fn)

//url：希望加载的地址

//[data]：可选，发送至服务器的key/value 数据

//fn：可选，回调函数

$.post(url,[data],fn,type)

//url：希望加载的地址

//[data]：可选，发送至服务器的key/value 数据

//fn：可选，回调函数

//type：可选，客户端请求的类型（JSON，XML 等等）

事件

局部事件：每次的ajax 请求时在方法内定义的事件

$.ajax({

beforeSend: function(){},

complete: cunction(){}

});

全局事件：每次的ajax 请求都会触发的事件

$('#btn').bind('ajaxSend',function(){

$(this).show();

})

或者

$('#btn').ajaxSrart(function(){
$(this).show();

})

禁用全局事件

$.ajax({

global：false，

...

});