Question

我不知道为什么，但它对我有用。也许我上传错了。 JS Fiddle Link

JS代码

$("#toggle-content").click(function () {
    $(".otherContainers").slideToggle(500);
});

$("#closeImgPP").click(function () {
    $(this).parent().hide(500);
});

$("#closeImgPP2").click(function () {
    $(this).parent().hide(500);
});

$("#closeImgPP3").click(function () {
    $(this).parent().hide(500);
});

我喜欢5个相同的div，我关闭每个div，例如我只关闭5个div中的3个，当我使用show / hide按钮时，它隐藏了当前打开的div并显示隐藏的div。

问题是我如何通过点击它来显示/隐藏按钮将显示所有内容并再次点击隐藏所有内容，或者像2个不同的按钮一个用于显示和一个用于隐藏

Answer 1

使用.show()和.hide()方法代替slideToggle

Answer 2

使用以下代码执行此操作：

$("#toggle-content").click(function () {
    $.each($(".otherContainers"),function(){
         $(this).toggle(500);
    });
});

因为您按类名使用选择器，而在文档中它是多个。所以你需要将切换应用到每一个。

Answer 3

你的小提琴不加载jQuery。在左上角，添加一个jQuery库。点击此处：http://jsfiddle.net/DQ26M/7/

在您的网站上添加一些onLoad功能可以很好（jsfiddle为您做这个）。例如：

$(function(){ ... });

Answer 4

我想你想要这样的东西 http://jsfiddle.net/blackjim/DQ26M/9/ 如果你想隐藏它们，你必须稍微改变你的设计（因为你将如何再次展示它们？）

$("#hide-content").click(function () {
    $(".otherContainers").hide(500);
});

$("#show-content").click(function () {
    $(".otherContainers").show(500);
});

$("#closeImgPP").click(function () {
    $(this).parent().hide(500);
});

编辑：也许closeImgPP应该是一个类，如果你想在每个'BLAHBLAH'中关闭它

Answer 5

检查这个小提琴，仅供参考，你忘了在你的小提琴中加入jquery库http://jsfiddle.net/DQ26M/11

$("#toggle-content").click(function () {
$(".otherContainers").slideUp(500);
$(".showContent").show();
});
$(".showContent").click(function () {
    $(this).hide(); $(".otherContainers").slideDown(500);
});

Answer 6

$('#btns2').on('click', function() {
$('.chos').hide();
$('#icon3').hide();
$('#icon').show();
});

$('#btns').on('click', function() {
$('.chos').show();
$('#btns2').show();
$('#icon3').show();
$('#icon').hide();
});

在一个按钮中，您可以隐藏节目或同时使用class / id切换div或选择器

显示同时隐藏所有具有相同类的div Java Script

6 个答案: