Jquery事件的连接使用示例


Posted in Javascript onJune 18, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>jQuery事件的连接</title> 
<style type="text/css"> 
.divFrame{ width:260px; border:1px solid #666; font-size:10px } 
.divTitle{ background-color:#eee; padding:5px} 
.divContent{ padding:5px; display:none} 
.divCurrColor{ background-color:Red} 
</style> 
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function(){ 
$('.divTitle').click(function () { 
$('.divTitle').addClass('divCurrColor') 
.next('.divContent').css('display','block') 
}) 
}) 
</script> 
</head> 
<body> 
<div class="divFrame"> 
<div class="divTitle">主题</div> 
<div class="divContent"> 
<a href="图片设置.htm">图片设置</a><br /> 
<a href="展开图片和收缩图片.htm">展开图片和收缩图片</a><br /> 
</div> 
</div> 
</body> 
</html>

实现以下效果
Jquery事件的连接使用示例 
点击它,会显示如下效果
Jquery事件的连接使用示例
Javascript 相关文章推荐
Prototype使用指南之range.js
Jan 10 Javascript
JavaScript入门教程(7) History历史对象
Jan 31 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
jQuery实现表格行上移下移和置顶的方法
May 22 Javascript
理解javascript中的MVC模式
Jan 28 Javascript
Javascript的表单验证-提交表单
Mar 18 Javascript
详解js运算符单竖杠“|”与“||”的用法和作用介绍
Nov 04 Javascript
js对象实例详解(JavaScript对象深度剖析,深度理解js对象)
Sep 21 Javascript
JS获取input[file]的值并显示在页面的实现方法
Mar 09 Javascript
vue.js图片转Base64上传图片并预览的实现方法
Aug 02 Javascript
关于AOP在JS中的实现与应用详解
May 06 Javascript
浅谈JavaScript中this的指向问题
Jul 28 Javascript
jquery属性过滤选择器使用示例
Jun 18 #Javascript
js实现的切换面板实例代码
Jun 17 #Javascript
javascript实现可改变滚动方向的无缝滚动实例
Jun 17 #Javascript
jQuery+JSON+jPlayer实现QQ空间音乐查询功能示例
Jun 17 #Javascript
JS图片无缝滚动(简单利于使用)
Jun 17 #Javascript
js二级地域选择的实现方法
Jun 17 #Javascript
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
Jun 17 #Javascript
You might like
php检测文件编码的方法示例
2014/04/25 PHP
PHP实现UTF-8文件BOM自动检测与移除实例
2014/11/05 PHP
PHP中防止SQL注入方法详解
2014/12/25 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
php实现有序数组打印或排序的方法【附Python、C及Go语言实现代码】
2016/11/10 PHP
PHP面向对象程序设计中的self、static、parent关键字用法分析
2019/08/14 PHP
Three.js源码阅读笔记(基础的核心Core对象)
2012/12/27 Javascript
Js 冒泡事件阻止实现代码
2013/01/27 Javascript
Javascript的时间戳和php的时间戳转换注意事项
2013/04/12 Javascript
js工具方法弹出蒙版
2013/05/08 Javascript
js创建元素(节点)示例
2014/01/02 Javascript
javascript创建和存储cookie示例
2014/01/07 Javascript
什么是 AngularJS?AngularJS简介
2014/12/06 Javascript
ubuntu下安装nodejs以及升级的办法
2015/05/08 NodeJs
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
2016/04/07 Javascript
JS读写CSS样式的方法汇总
2016/08/16 Javascript
详解JS-- 浮点数运算处理
2016/11/28 Javascript
js实现上下左右弹框划出效果
2017/03/08 Javascript
Webpack执行命令参数详解
2017/06/17 Javascript
使用Dropzone.js上传的示例代码
2017/10/10 Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
2018/08/19 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
2019/06/19 Javascript
JS实现图片幻灯片效果代码实例
2020/05/21 Javascript
[02:43]DOTA2亚洲邀请赛场馆攻略——带你走进东方体育中心
2018/03/19 DOTA
python画出三角形外接圆和内切圆的方法
2018/01/25 Python
python如何实现不用装饰器实现登陆器小程序
2019/12/14 Python
python 如何上传包到pypi
2020/12/24 Python
火山动力Java笔试题
2014/06/26 面试题
高中生学习生活的自我评价
2013/11/27 职场文书
成功的酒店创业计划书
2013/12/27 职场文书
代理协议书范本
2014/04/22 职场文书
学生顶撞老师的检讨书
2014/09/17 职场文书
小兵张嘎观后感
2015/06/03 职场文书
趣味运动会广播稿
2015/08/19 职场文书
详解MySQL集群搭建
2021/05/26 MySQL
MySQL中dd::columns表结构转table过程及应用详解
2022/09/23 MySQL