hover(Function, Function) 当鼠标move over时触发第一个function，当鼠标move out时触发第二个function样式：<style>.red{color:#FF0000}</style>Html代码： <div id="a">sdf</div>jQuery代码及效果 $(function(){ $("#a").hover(function(){$(this).addClass("red");}, function(){ $(this).removeClass("red"); });})最终效果是当鼠标移到id为a的层上时图层增加一个red样式，离开层时移出red样式toggle(Function, Function) 当匹配元素第一次被点击时触发第一个函数，当第二次被点击时触发第二个函数样式：<style>.red{color:#FF0000}</style>Html代码： <div id="a">sdf</div>jQuery代码及效果 $(function(){ $("#a"). toggle (function(){$(this).addClass("red");}, function(){ $(this).removeClass("red"); });})最终效果是当鼠标点击id为a的层上时图层增加一个red样式，离开层时移出red样式bind(type, fn) 用户将一个事件和触发事件的方式绑定到匹配对象上。trigger(type) 用户触发type形式的事件。$("p").trigger("click")还有：unbind() unbind(type) unbind(type, fn)Dynamic event(Function) 绑定和取消绑定提供函数的简捷方式例： $("#a").bind("click",function() { $(this).addClass("red");})也可以这样写： $("#a").click(function() { $(this).addClass("red");}); 最终效果是当鼠标点击id为a的层上时图层增加一个red样式，jQuery提供的函数 用于browers事件error(fn) load(fn) unload(fn) resize(fn) scroll(fn)用于form事件change(fn) select(fn) submit(fn)用于keyboard事件keydown(fn) keypress(fn) keyup(fn)用于mouse事件click(fn) dblclick(fn) mousedown(fn) mousemove(fn)mouseout(fn) mouseover(fn) mouseup(fn) 用于UI事件blur(fn) focus(fn)以上事件的扩展再扩展为5类举例，click(fn) 扩展 click() unclick() oneclick(fn) unclick(fn)click(fn)：增加一个点击时触发某函数的事件click()：可以在其他事件中执行匹配对象的click事件。unclick ()：不执行匹配对象的click事件。oneclick(fn)：只增加可以执行一次的click事件。unclick (fn)：增加一个点击时不触发某函数的事件。上面列举的用于browers、form、keyboard、mouse、UI的事件都可以按以上方法扩展。 七：Ajax支持 通用方式：$.ajax(prop) 通过一个ajax请求，回去远程数据，prop是一个hash表，它可以传递的key/value有以下几种。 (String)type：数据传递方式(get或post)。 ((String)url：数据请求页面的url ((String)data：传递数据的参数字符串，只适合post方式 ((String)dataType：期待数据返回的数据格式(例如 "xml", "html", "script",或 "json") ((Boolean)ifModified： 当最后一次请求的相应有变化是才成功返回，默认值是false ((Number)timeout:设置时间延迟请求的时间。可以参考$.ajaxTimeout ((Boolean)global：是否为当前请求触发ajax全局事件，默认为true ((Function)error：当请求失败时触发的函数。 ((Function)success：当请求成功时触发函数 ((Function)complete：当请求完成后出发函数jQuery代码及说明 $.ajax({url: "ajax.htm", success:function(msg){ $(div"#a").html(msg); } });将ajax.htm返回的内容作为id为a的div内容 $.ajax({ url: "ajax.aspx", type:"get", dataType:"html", data: "name=John&location=Boston", success:function(msg){ $("#a").html(msg); } }); 用get方式向ajax.aspx页面传参数，并将返回内容负给id为a的对象。$.ajaxTimeout(time) 设置请求结束时间 $.ajaxTimeout( 5000 )其它简化方式： $.get(url, params, callback) 用get方式向远程页面传递参数，请求完成后处理函数，除了url外，其它参数任意选择！ $.get( "ajax.htm" , function(data){ $("#a").html(data) }) $.get( "ajax.asp", { name: "young", age: "25" }, function(data){ alert("Data Loaded: " + data); } ) $.getIfModified(url, params, callback) 用get方式向远程页面传递参数，从最后一次请求后如果数据有变化才作出响应，执行函数callback$.getJSON(url, params, callback) 用get方式向远程json对象传递参数，请求完成后处理函数callback。$.getScript(url, callback) 用get方式载入并运行一个远程javascript文件。请求完成后处理函数callback。$.post(url, params, callback) 用post方式向远程页面传递参数，请求完成后处理函数callbackload(url, params, callback) 载入一个远程文件并载入页面DOM中，并执行函数callback $("#a").load("ajax.htm", function() { alert("load is done"); } );向ajax.htm页面发出请求，将返回结果装入id为a的内容中，然后再执行函数callback。loadIfModified(url, params, callback) 用get方式向远程页面传递参数，从最后一次请求后如果数据有变化才作出响应，将返回结果载入页面DOM中，并执行函数callbackajaxStart(callback) 当ajax请求发生错误是时执行函数callbackajaxComplete(callback) 当ajax请求完成时执行函数callbackajaxError(callback) 当ajax请求发生错误时执行函数callbackajaxStop(callback) 当ajax请求停止时执行函数callbackajaxSuccess(callback) 当ajax请求成功时执行函数callback 八：jQuery插件 随着jQuery的广泛使用，已经出现了大量jQuery插件，如thickbox，iFX，jQuery-googleMap等，简单的引用这些源文件就可以方便的使用这些插件。这里我简单的介绍一些网址供大家参考，这些网站头提供了大量的demo，并且使用及其简单，及时E文不好，也能快速掌握！ http://jquery.com/plugins 官方推荐 http://interface.eyecon.ro/demos 效果超级棒，使用更简单，一定有你喜欢的！ http://www.dyve.net/jquery/ http://bassistance.de/jquery-plugins 还有其它很多插件，大家可以google以下，如果大家发现好的了，可以留言共享以下！ —————————————————————————————————————————————— 至此jQuery已经介绍完毕，并合并整理提供给大家 下载 ，更多详细的使用请大家参考官方网站，下面我再推荐一些jQuery的学习网站方便大家更好的掌握这项工具！ http://keel.sike.googlepages.com/jQuery_getting_started.html 中文入门介绍，Keel翻译 http://jquery.com/api jquery提供全部基本方法的介绍及demo，方便大家查询！

　　推荐阅读

　　用prototype实现的简单小巧的多级联动菜单

使用prototype.js这个js库,这个在网上一搜就能找到了，是一个开源的js函数库。 看到今天贴了几个联动菜单的帖子 这个应该大家都有各自比较好的代码了 我也顺手贴一个我们team里面用的比较小巧的代码 // author: d>>>详细阅读

本文标题：jQuery使用手册之 事件处理

地址：http://www.17bianji.com/kaifa2/JS/30693.html

 1/2    1