jQuery在關閉/隱藏時切換一個元素

Question

我是Js初學者，這是我的代碼（圖片不一樣，但它正是我想要的）：

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

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

看看這個： http ： //jsfiddle.net/vk7AE/1/

我希望當我點擊圖像時，會出現與此圖像相關聯的文本，如果我單擊其他圖像，則前面的文本會消失，並且與所單擊圖像關聯的新文本會出現在其位置。

事實上，我希望人們可以同時打開一個文本。

我希望你能包括/理解我的問題，並且你將能夠幫助我。

問候。

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

屬性-等於選擇器

^ attribute-starts-with-selector

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

$('[id^="work-info"]'); 選擇id以work-info開頭的所有元素

OP評論后更新

DEMO

$('#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");
});

。不（）

Answer 2

   $('#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/