jQuery事件 & Ajax

事件

1. 常用事件
   (1) 鼠标事件
     ① click([[data],fn])        //点击时触发 click = mousedown + mouseup
     ② dblclick([[data],fn])      //双击事件 dblclick = 2*click
     ③ mousedown([[data],fn])
     ④ mouseup([[data],fn])
     ⑤ mousemove([[data],fn])
     ⑥ mouseout([[data],fn])
     ⑦ mouseover([[data],fn])
     ⑧ mouseenter([[data],fn])    //事件不会冒泡
     ⑨ mouseleave([[data],fn])    //事件不会冒泡
   
   (2) 键盘事件
     ① keydown([[data],fn])      //键盘按下时触发
     ② keypress([[data],fn])      //字符按键
     ③ keyup([[data],fn])       //键盘弹起时触发
   
   (3) 表单事件
     ① blur([[data],fn])        //失去焦点时触发
     ② focus([[data],fn])       //获得焦点
     ③ change([[data],fn])      //值改变并失去焦点时触发
     ④ submit([[data],fn])
   
   (4) 其他事件
     ① resize([[data],fn])      //元素大小改变时触发
     ② scroll([[data],fn])      //滚动时触发

2. jquery事件绑定与移除
   (1) on(type,[selector],fn)
     ① selector: 把本来绑定给selector的事件委托给它的父级
     ② 事件命名空间, 自定义事件（对事件加以细分）
       格式：事件类型.自定名字
     ③ 一次性绑定多个事件，事件之间以空格隔开
     ④ 支持自定义事件的绑定

	$(ele).on('laowang',function(){})
    触发自定义事件：$(ele).trigger('laowang');

  (2) off: 清除绑定事件
   ① off(‘click’);//清除当前元素的点击事件
   ② off();//清除当前元素所有事件
   ③ off(‘click mouseover’) 一次性清除多个事件，事件之间以空格隔开
   ④ off(‘click.output’) 清除命名空间事件

3. 其他事件方法
   (1) hover(enter[,leave])
    ① enter:鼠标移入时执行
    ② leave:鼠标移出时执行
    备注：hover方法内部使用mouseenter + mouseleave来实现效果

  (2) trigger(type)
    手动触发事件（即使事件没有发生，也能执行事件处理函数）

  (3) triggerHandler(type)
    这个方法会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认行为，也 不会产生事件冒泡

  (4) 阻止浏览器默认行为
    event.preventDefault()

  (5)阻止事件传播
    event.stopPropagation()

  (6) 两者一起阻止
   return false

Ajax

1. jQuery的ajax方法
   (1)

		$.ajax({
			url:"",
			type:"",
			data: "",
			success: function(res){console.log(res);}
		})

• type:请求类型，默认GET
• url:数据请求地址（API地址）
• data:发送到服务器的数据对象，格式：{Key:value}。
• success:请求成功时回调函数。
• dataType:设定返回数据的格式，json, jsonp, text(默认), html, xml, script
• async：是否为异步请求，默认true

(2) $.get(url,[data],[fn],[dataType])      // type:’get’

(3) $.post(url,[data],[fn],[dataType])     // type:’post’

(4) $.getJSON(url,[data],[fn])        // type:’get’, dataType:’json’

(5) $.getScript(url,[callback])       // type:’get’, dataType:’script’

(6) load(url,[data],[callback])       // 载入远程 HTML 文件代码并插入页面中