 
<!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="圖片設(shè)置.htm">圖片設(shè)置</a><br /> 
<a href="展開圖片和收縮圖片.htm">展開圖片和收縮圖片</a><br /> 
</div> 
</div> 
</body> 
</html> 

實(shí)現(xiàn)以下效果

點(diǎn)擊它，會(huì)顯示如下效果

您可能感興趣的文章:

相關(guān)文章

擴(kuò)展jquery實(shí)現(xiàn)客戶端表格的分頁(yè)、排序功能代碼
下面鏈接中是我用jQuery的擴(kuò)展來(lái)實(shí)現(xiàn)的表格分頁(yè)和排序，使用這個(gè)擴(kuò)展必須加上表頭<thead>和<tbody>標(biāo)簽，因?yàn)槲沂?通過(guò)<tbody>來(lái)進(jìn)行分頁(yè)的，要是不加thead，那么表頭也要作為分頁(yè)計(jì)算時(shí)的一個(gè)行了。
2011-03-03
jquery實(shí)現(xiàn)可自動(dòng)判斷位置的彈出層效果代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)可自動(dòng)判斷位置的彈出層效果代碼,可實(shí)現(xiàn)根據(jù)鼠標(biāo)位置進(jìn)行合理的判斷并顯示彈出層的功能,涉及jQuery鼠標(biāo)事件及頁(yè)面元素位置屬性的相關(guān)判定技巧,需要的朋友可以參考下
2015-10-10
jQuery?UI菜單部件Menu?Widget
這篇文章介紹了jQuery?UI菜單部件Menu?Widget，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2022-06-06
jQuery模仿ToDoList實(shí)現(xiàn)簡(jiǎn)單的待辦事項(xiàng)列表
這篇文章主要介紹了jQuery模仿ToDoList實(shí)現(xiàn)簡(jiǎn)單的待辦事項(xiàng)列表，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-12-12
使用jq獲取元素值的常見寫法總結(jié)
這篇文章給大家總結(jié)了使用jq獲取元素值的常見寫法,文中給大家介紹了詳細(xì)的代碼示例,對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下
2023-12-12
jquery表單插件Autotab使用方法詳解
這篇文章主要為大家詳細(xì)介紹了jquery表單插件Autotab使用方法，Autotab自動(dòng)Tab文本框，感興趣的小伙伴們可以參考一下
2016-06-06
jQuery簡(jiǎn)單判斷值是否存在于數(shù)組中的方法示例
這篇文章主要介紹了jQuery簡(jiǎn)單判斷值是否存在于數(shù)組中的方法,涉及jQuery數(shù)組遍歷及基于$.inArray的元素判斷相關(guān)操作技巧,需要的朋友可以參考下
2018-04-04
JQuery控制Radio選中方法分析
這篇文章主要介紹了JQuery控制Radio選中方法,涉及jQuery表單操作及鼠標(biāo)事件響應(yīng)的方法,需要的朋友可以參考下
2015-05-05
jQuery表格排序組件-tablesorter使用示例
這篇文章主要介紹了jQuery表格排序組件-tablesorter的使用,需要的朋友可以參考下
2014-05-05
百度多文件異步上傳控件webuploader基本用法解析
這篇文章主要為大家詳細(xì)介紹了百度多文件異步上傳控件webuploader基本用法解析
2016-11-11