Chapter4.jQueryAdvanced.pptxVIP

jQuery Advanced;Events;统一不同浏览器差异 which[keyCode/charCode] pageX/pageY event.preventDefault() event.stopPropagation() 增强 在事件处理函数中通过this获得触发事件的对象 在事件处理函数的第一个参数获得event对象 支持事件触发的数据传递 支持事件命名空间和灵活的事件绑定和触发 ;替代window.load事件 Usage 1 $(document).ready(function(){ // 在这里写你的代码... }); Usage II $(function() { //在这里写你的代码... }); 支持多次绑定，按绑定顺序执行 ;.bind(type,fn) 为元素绑定事件处理函数 type可以是浏览器事件名称或自定义事件名称 type可以有多个，有空格分开 事件处理函数的参数可以省略 事件处理函数如果返回false将阻止事件冒泡和默认行为 .unbind(type) 为元素取消指定类型的事件绑定 不指定参数则取消元素的所有事件绑定 .one(type,fn) 功能与bind类似，但仅执行一次 相当于先bind然后在事件处理函数中unbind;live(type,fn) 增强型bind，为元素绑定事件，即使这个元素是以后再添加进来的也有效 用在动态创建内容时非常有效 die(type) 解除live绑定;blur( [fn] ) change( [fn] ) click( [fn] ) dblclick( [fn] ) error( [fn] ) focus( [fn] ) focusin( [fn] ) focusout( [fn] ) keydown( [fn] ) keypress( [fn] ) keyup( [fn] ) mousedown(fn) mousemove(fn) mouseout(fn) mouseover(fn) mouseup(fn) resize(fn) scroll(fn) select( [fn] ) submit( [fn] ) unload(fn) ;hover(overFn,outFn) 对鼠标指针移入和移出提供的便捷支持 toggle(fn, fn2, [fn3, fn4, ...]) 对多次点击事件的便捷支持 每次点击都重复对这几个函数的轮番调用 通常用于使用元素表示多种状态值的情况 ;trigger(type, [data]) 触发指定类型的事件 如果是浏览器事件则浏览器行为也为触发 可以让事件处理函数返回false 事件会冒泡 可以让事件处理函数返回false triggerHandler(type, [data]) 触发指定类型的事件 不会执行浏览器默认动作，也不会产生事件冒泡 此方法返回事件处理函数的返回值 无返回值则为undefined 因此应当使用 result === false判断返回值;Ajax;核心思想 不刷新当前页面，实现与服务器交互 交互数据格式推荐使用json而不是xml 不是新技术 在最早的山立开发平台中已经使用 2005 当??是使用iframe完成交互和页面更新 微软最早在IE中提供 各浏览器存在兼容性问题 jQuery.Ajax进行了统一和增强;最原始的提供 参数多，不常用 仅用于少数特殊场合;script type=text/javascript src=js/jquery-1.5.1.js/script script type=text/javascript $(document).ready(function(){ $(:button).click(function(){ $.post(Controller,{sl.service:$(this).val()},function(resp){ alert(resp.message); },json); }); }); /script /head body input type=button value=service.start / input type=button value=service.stop / /body;$(elem).load(url, [data], [callback]) 加载url并将url中的html放入指定元素 $.getJSON(url, [data], [callback]) 使用JSONP方式突破JS同源限制 $.getScript(url, [callback]) 动态加载js 不使用浏览器本地缓存 使用url?new Date().getTime();ajaxStart