jQuery通过关闭/隐藏一次切换一个元素

jQuery Toggle one element at time with closing/hiding

本文关键字：一次 元素 一个 隐藏 jQuery      更新时间：2023-09-26

我是Js的初学者，下面是我的代码（图片不一样，但正是我想要的）：

        $('#img-expand').click(function () {
        $("#work-info").slideToggle("slow");
    });
    $('#img-expand_2').click(function () {
        $("#work-info_2").slideToggle("slow");
    });

看看这个：http://jsfiddle.net/vk7AE/1/

我希望当我点击一个图像时，与此图像相关的文本会出现，如果我点击另一个图像，前面的文本会消失，与点击的图像相关的新文本会出现在它的位置。

事实上，我希望人们在同一时间只能打开一个文本。

我希望你能理解我的问题，并能帮助我。

谨致问候。

DEMO

$('#img-expand').click(function () {
    $('[id^="work-info"]').hide();
    $("#work-info").slideToggle("slow");
});
$('#img-expand_2').click(function () {
    $('[id^="work-info"]').hide();
    $("#work-info_2").slideToggle("slow");
});

属性等于选择器

^属性从选择器开始

Description: Selects elements that have the specified attribute with 
a value beginning exactly with a given string.

$('[id^="work-info"]');选择id从work-info 开始的所有元素

OP评论后更新

演示

$('#img-expand').click(function () {
    $('[id^="work-info"]').not('#work-info').hide();
    $("#work-info").slideToggle("slow");
});
$('#img-expand_2').click(function () {
    $('[id^="work-info"]').not('#work-info_2').hide();
    $("#work-info_2").slideToggle("slow");
});

.not（）

   $('#img-expand').click(function () {
        var slide = $("#work-info").is(":visible");
        $(".part-body-opacity p").slideUp();
        if(!slide)
           $("#work-info").slideToggle("slow");
    });
    $('#img-expand_2').click(function () {
        var slide = $("#work-info_2").is(":visible");
        $(".part-body-opacity p").slideUp();
        if(!slide)
           $("#work-info_2").slideToggle("slow");
    });

http://jsfiddle.net/vk7AE/5/

相关文章：