<div class="codetitle"> <span><a style="CURSOR: pointer" data="26069" class="copybut" id="copybut26069" onclick="doCopy('code26069')"><u>复制代</u></a></span> 代码如下:</div> <div class="codebody" id="code26069"> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <BR><html xmlns="http://www.w3.org/1999/xhtml"> <br> <br><title>jQuery イベントの接続</title> <br><style type="text/css"> <br>.divFrame{幅:260px;ボーダー:1px ソリッド #666; font-size:10px } <br>.divTitle{ 背景色:#eee;パディング:5px} <br>.divContent{ パディング:5px;表示:なし} <br>.divCurrColor{ 背景色:赤} <br></style> <br><script src="jquery-1.9.1.js" type="text/javascript"></script> <br><script type="text/javascript"> <br>$(function(){ <br>$('.divTitle').click(function () { <br>$('.divTitle').addClass('divCurrColor') <br>.next(' .divContent').css('display','block') <br>}) <br>}) <br></script> <br></head> <br> <br><div class="divFrame"> <br><div class="divTitle">主题</div> <br><div class="divContent"> <br><a href="画像設置.htm">画像設置</a><br /> <br><a href="展示写真および收缩写真.htm">展示写真および收缩写真</a><br /> <br> </div> <br> <br></body> <br></html> <br> <br>实现以下效果 <br><img src="http://files.jb51.net/file_images/article/201306/201306181720332.gif?201351817211" alt="Jqueryイベント接続の使用例example_jquery" > <br>点击它，会显示如下效果 <br><img src="http://files.jb51.net/file_images/article/201306/201306181721193.gif?2013518172132" alt="Jqueryイベント接続の使用例example_jquery" >
