本文实例讲述了jQuery基于事件控制实现点击显示内容下拉效果。分享给大家供大家参考，具体如下：

1、实例代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /titlejQuery事件/title脚本类型=' text/JavaScript ' src=' http : jquery-1。7 .2 .量滴js '/脚本样式类型=' text/CSS '正文{ font-family :微软雅黑；font-size :12 pxfont-stretch :正常；背景-颜色：重要；宽度宽度：400像素宽度：汽车。总计{ border:#00FF00固体1px font-size :12 px；} .模块{ padd :6 pxfont-size :14 px；字体粗细：加粗；背景色： # FC6；} .内容{ padd :8 pxfont-size :12 px；字体系列：微软雅黑；文本对齐：居中；display:none}。打开{底色： # 0000 ff}/style脚本类型=' text/JavaScript ' $(function(){ $(').内容')。html(")你好，欢迎来到我们！');$('.模块')。单击(function(){ $(this)).addClass('open ').下一个('。内容')。css('display '，' block ')；$(这个)。css('color '，' # FFFFF ')；});});/script/head body div class=' total ' div class=' module '模块/div class=' content '/div/div/body/html 2、实例结果：

(1)初始化

(2)点击"模块"

PS:这里再附上爪哇岛描述语言常见事件与功能说明的在线对照表供大家参考：

爪哇岛描述语言事件与功能说明大全：http://工具。JB 51。net/table/JavaScript _ event

更多关于jQuery相关内容感兴趣的读者可查看本站专题： 《jQuery常见事件用法与技巧总结》 、 《jQuery常用插件及用法总结》 、 《jQuery操作json数据技巧汇总》 、 《jQuery扩展技巧总结》 、 《jQuery拖拽特效与技巧总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jQuery常见经典特效汇总》 、 《jQuery动画与特效用法总结》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。