Question

问候，

我是一个刚开始使用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，无论我点击什么门票名称。

理想情况下，我想显示我点击的故障单名称的说明。不是所有的人。有可能吗？

感谢您的帮助。

Answer 1

完全可能，是的。

您遇到的第一个问题是您在循环中重复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);
  });
});

如果数据库中没有正确的HTML表单，请记住在数据库中使用htmlentities()。

Answer 2

是的，你正在切换之后。也许使用id来选择你想要的div而不仅仅是普通的div。

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

通过为链接分配一个类来定位特定的div。

折叠/展开我选择的div而不是全部？

2 个答案: