3

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

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

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

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

我希望当我单击图像时，会出现与该图像相关联的文本，并且如果我单击另一张图像，则前面的文本会消失，并且与单击的图像相关联的新文本会出现在其位置。

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

我希望你能包括/理解我的问题，并且你将能够帮助我。

问候。

4

2 回答 2

3

演示

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

。不是（）

于 2013-08-28T07:37:49.330 回答
1 
   $('#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/

于 2013-08-28T07:38:36.477 回答