折叠/展开只有我选择的，而不是所有的div？

StackOverflow https://stackoverflow.com/questions/4251514

  •  27-09-2019
  •  | 
  •  

题

问候，

我是谁刚开始使用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所有打开的票，不管是什么票的名字我点击。

在理想情况下，我想显示对我点击了传票名称的说明。不是所有的人。这可能吗？

感谢您的帮助。

有帮助吗？

解决方案

完全可能的，是

在具有第一个问题是，你是在循环重复的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表单。

其他提示

是的，你拨动后是。也许用一个id选择要，而不仅仅是普通的div的div。

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

目标特定的div通过向链路分配的类。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top