0

问候，

我是一个刚开始接触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，而不管我单击了哪个工单名称。

理想情况下，我想显示我点击的工单名称的描述。不是所有的人。可能吗？

谢谢你的帮助。

4

2 回答 2

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);
  });
});

htmlentities()如果它们还不是正确的 HTML 格式，请记住使用数据库中的回声。

于 2010-11-23T00:17:41.553 回答
0

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

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

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

于 2010-11-23T00:19:32.650 回答