Question

几天前，我问了一个关于折叠div的问题（[link text] [fold-unfold div]）。我得到的答案让我在编码方面取得了很大的进步。但是，我的要求已经改变了。

作为一个拥有所有这些网络内容的新手，我虽然用表格和表格标题包装div很容易。男孩，我错了。

<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; color: black; }
#expand      {background-color: #fff;}
.description {display: none;         }
.entry       {margin: 0; padding: 0px;}
</style>
<script src="jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".entry a").click(function() {
    $(this).parents('.entry').find('.description').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");
?>
<table border="1">
<thead>
<tr>
<th>title</th>
</tr>
</thead>
<?php
while ($row = mysql_fetch_array($result)) {
?><div class="entry"><tr>
<td>
<a href="#expand"><?php echo htmlentities($row['title']); ?></a>
<div class="description"><?php echo htmlentities($row['description']); ?></div>
</td>
</tr></div>
<?php
}
mysql_close($con);
?>
</table>
</body>
</html>

现在，单击故障单标题不起作用。我删除了表格的所有代码，它工作正常：点击标题，说明展开

我应该能够将div（扩展和描述）折叠到我的桌子上，对吧？我错过了什么？

Answer 1

克里斯，看看这里：http://jsfiddle.net/neopreneur/kdFHP/

您的HTML需要如下所示：

<table border="1">
    <thead>
        <tr>
            <th>title</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td class="entry">
                <a href="#expand">Title Text (click here)</a>
                <div class="description">Description Text</div>
            </td>
        </tr>
    </tbody>
</table>

在表中折叠/展开div？

1 个答案: