javascript - 如何将图像重新显示回来？

Question

在我的项目中，目标是当我单击一张图像(例如northview)时应显示一张图像。 再次，当我单击另一个图像(例如，southview)时，另一个图像应该与之前存在的图像重叠，并且当我按下另一个按钮时，它应该像这样继续。

使用现有的代码，它只能工作一次。即，如果我按northview，图像就会出现，如果我按southview，另一个图像就会出现在它上面，但是当我再次按northview时，相应的图像不会出现。 建议我在代码中更改哪些内容。

这是我的custom.js

/*-----------------------------------------------------------------------------------*/
/* INCREASE IMAGE SIZE ON MARKER BUTTON CLICK: PLAN PAGE
/*-----------------------------------------------------------------------------------*/
jQuery(document).ready(function() {
$("#southview").click(function() {
    $('.southviewpart').show();
    /*$("#leftpart").find("*").prop("disabled",true);*/

});

$("#northview").click(function(){
    $('.northviewpart').show();
});

$("#eastview1").click(function(){
    $('.eastviewpart').show();
});

$("#eastview2").click(function(){
    $('.eastviewpart').show();
});
});

/*-----------------------------------------------------------------------------------*/
/* HIDE IMAGE ON CLICKING IMAGE: PLAN PAGE
/*-----------------------------------------------------------------------------------*/
jQuery(document).ready(function() {
$('.southviewpart').click(function() {
    $('.southviewpart').hide();

});

$('.northviewpart').click(function(){
    $('.northviewpart').hide();
});

$('.eastviewpart').click(function(){
    $('.eastviewpart').hide();
});
});

Answer 1

感谢您的建议和解决方案，但是我稍微修改了我的代码

jQuery(document).ready(
    function()
    {
        $("#southview").click(
            function()
            {
                $('.northviewpart').hide();
                $('.southviewpart').show();
                /*$("#leftpart").find("*").prop("disabled",true);*/
            }
        );

        $("#northview").click(
            function()
            {
                $('.southviewpart').hide();
                $('.northviewpart').show();
            }
        );
    }
);

现在工作正常。

使用toggle()方法进行一些更改

 $('.northviewpart').hide();
    $('.southviewpart').hide();
$('#south').click(function() {
    $('.southviewpart').toggle();
  $('.northviewpart').hide();
});

$('#north').click(function(){
    $('.northviewpart').toggle();
     $('.southviewpart').hide();
});