摺疊/展開只選擇我選擇的div而不是全部？

我是一個剛剛開始使用jQuery的新手。我正在爲我們的團隊構建一個基本的PHP應用程序，該應用程序顯示開放式幫助臺門票列表。

爲了避免混淆屏幕，我只想顯示票證的標題，如果點擊，它的描述。

這裏是我的代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
     <title>Animate my Div</title> 
     <style type="text/css" media="screen"> 
      a {     text-decoration: none;    } 
      #expand {     background-color: #fff;    } 
      #mydiv {     display: none;    } 
     </style> 
     <script src="jquery-1.3.2.js" type="text/javascript"></script> 
     <script type="text/javascript"> $(document).ready(function(){ 
    $("a").click(function(){ $("div").slideToggle(1000);    }); 
      });   </script> 
    </head> 
    <body> 
     <?php 
     $con = mysql_connect("korg", "joe", "bob"); 
     if (!$con) {    die('Could not connect: ' . mysql_error()); } 
     mysql_select_db("wfr11", $con); 
     $result = mysql_query(" select title, description from webcases"); 
     while ($row = mysql_fetch_array($result)) { 
     ?> 
      <p><a href="#expand"><?php echo $row['title']; ?></a></p> 
      <div id="mydiv"><?php echo $row['description']; ?></div> 
     <?php 
     }   mysql_close($con);   ?> 
    </body> 
</html>

現在，我的代碼工作，但展現的所有的div所有打開的票，不管我點擊了哪些傳票名稱。

理想情況下，我想顯示我單擊的故障單名稱的說明。不是所有的人。可能嗎？

感謝您的幫助。

來源

2010-11-23 Chris

完全可能，是的。

您遇到的第一個問題是您要在循環中重複一個ID，HTML ID必須是唯一的。我會建議在那裏使用一堂課。在一個DIV包裹兩種成分在一起，使它們以可與獨立以及

<?php 
while ($row = mysql_fetch_array($result)) { 
?> 
<div class="entry"> 
    <p><a href="#expand"><?php echo $row['title']; ?></a></p> 
    <div class="description"><?php echo $row['description']; ?></div> 
</div> 
<?php 
} 
?>

然後進行處理聯合項目，你需要讓你的jQuery選擇剛纔相鄰描述DIV。

$(document).ready(function(){ 
    $(".entry a").click(function() { 
    $(this).parents('.entry').find('.description').slideToggle(1000); 
    }); 
});

請記住，使用您的迴音的htmlentities()從數據庫中，如果他們是不是已經在正確的HTML形式。

來源

2010-11-23 00:17:41 Orbling

@Orbling：你的解決方案像一個魅力工作！我所要做的就是爲「.description {display：none;}」和「entry {margin：0; padding：0px;}」創建兩個CSS類。 – Chris 2010-11-23 17:25:36

是的，你在切換後。也許使用一個id來選擇你想要的div，而不僅僅是普通的div。

$(".link_class").click(function(){ $("#my_div").slideToggle(1000);    });

通過給鏈接分配一個類來指定特定的div。

來源

2010-11-23 00:19:32

摺疊/展開只選擇我選擇的div而不是全部？

回答

相關問題