Javascript 单击按钮时使用JQuery显示/隐藏特定Div

我试图在单击按钮时隐藏/显示/切换div。我正在使用ASP.NET，所有内容都在ASP:Datalist中

我可以正确显示或隐藏div。但是，它会打开所有div，而不仅仅是选择按钮的div。div正在尝试显示/隐藏is。content

如何仅打开按钮所属的div

JSFiddle-下面是一个问题示例

剧本：

<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery(".content").hide();
    });
</script>
<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('#man').live('click', function (event) {
           jQuery('.content').toggle('show');
        });
    });
</script> 

jQuery（文档）.ready（函数（）{
jQuery（“.content”）.hide（）；
});
jQuery（文档）.ready（函数（）{
jQuery（“#man”）.live（'click'，函数（事件）{
jQuery（'.content'）.toggle（'show'）；
});
});

数据列表（ASP.NET）

问题

问题类型

复选框（多选）
下降
开放式
单选按钮（单选）
范围（百分比）
答案
jQuery（文档）.ready（函数（）{
jQuery（“.content”）.hide（）；
});
jQuery（文档）.ready（函数（）{
jQuery（“#man”）.live（'click'，函数（事件）{
jQuery（'.content'）.toggle（'show'）；
});
});

试试这个：

jQuery(document).ready(function () {
        jQuery('#man').live('click', function (event) {
           $(this).closest('.heading').next().toggle('show');
        });
    });

---

如果用类值替换id属性，则以下代码更改可能有效：

jQuery('.man').live('click', function (event) {
    jQuery(this).parents().find(jQuery('.content')).toggle('show');
});

设置“.content”css显示：无，然后写下这个

<script type="text/javascript">
    $(document).ready(function () {
        jQuery('#man').toggle(function () {
            jQuery(".content").sliceDown();
        }, function () {
            jQuery(".content").sliceUp();
        });
    });
</script>

$（文档）.ready（函数（）{
jQuery（'#man'）。切换（函数（）{
jQuery（“.content”）.sliceDown（）；
}，函数（）{
jQuery（“.content”）.sliceUp（）；
});
});

一个id属性值在一个页面上只能使用一次。请注意：如其他注释所述，您不应在一个页面上多次使用同一id值，因为它是唯一的标识符。如果更多的DOM对象具有相同的标识符，一些浏览器可能难以识别正确的DOM对象。这会导致div反弹。如果div被隐藏，我按下的按钮是：打开->关闭->打开。然后保持可见/打开状态。如果再次按下按钮，则顺序相反。有什么想法吗？解决了：我从ASP数据列表的项目模板中删除了脚本。

<script type="text/javascript">
    $(document).ready(function () {
        jQuery('#man').toggle(function () {
            jQuery(".content").sliceDown();
        }, function () {
            jQuery(".content").sliceUp();
        });
    });
</script>