Jquery事件的连接使用示例
Jquery事件的连接使用示例
发布时间:2017-01-14 来源:查字典编辑
摘要:复制代码代码如下:jQuery事件的连接.divFrame{width:260px;border:1pxsolid#666;font-siz...

复制代码 代码如下:

<!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>

<div>主题</div>

<div>

<a href="图片设置.htm">图片设置</a><br />

<a href="展开图片和收缩图片.htm">展开图片和收缩图片</a><br />

</div>

</div>

</body>

</html>

实现以下效果

1

点击它,会显示如下效果

2

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类