如何在点击下一个标签时隐藏上一张图片?

时间:2017-06-10 09:00:33

标签: jquery

我有3个标签。还有像滑块一样的图像背景。页面加载第一张图像正确显示。页面加载后,如果我单击任何选项卡,则新图像背景位于上一图像下方,而不隐藏上一张图像。我想如果我点击任何标签,那么标签部分的图像背景应该改变。我的问题是如何隐藏以前点击的标签图像。请帮助我!!

SELECT ID
,REPLACE(REPLACE( REPLACE(Name,' ','><'), '<>',''),'><',' ') 
FROM #TAB

2 个答案:

答案 0 :(得分:0)

将此代码替换为您的js代码。

<script>
$(document).ready(function() {
    $(".hotel").click(function () {
        $(".slice1").addClass("imgActive");
$(".slice6").removeClass("imgActive");
    });
    $(".cars").click(function () {
        $(".slice2").addClass("imgActive");
$(".slice1").removeClass("imgActive");
    });
    $(".flights").click(function () {
        $(".slice3").addClass("imgActive");
$(".slice2").removeClass("imgActive");
    });
    $(".packages").click(function () {
        $(".slice4").addClass("imgActive");
$(".slice3").removeClass("imgActive");
    });
    $(".cruises").click(function () {
        $("slice5").addClass("imgActive");
$(".slice4").removeClass("imgActive");
    });
    $(".condos").click(function () {
        $(".slice6").addClass("imgActive");
$(".slice5").removeClass("imgActive");
    });
});
</script>

答案 1 :(得分:0)

<script>
    $(document).ready(function() {
        $(".hotel").click(function () {
            $(".slice1").addClass("imgActive");
            $(".slice2, .slice3, .slice4, .slice5, .slice6").removeClass("imgActive");

        });
        $(".cars").click(function () {
            $(".slice2").addClass("imgActive");
            $(".slice1, .slice3, .slice4, .slice5, .slice6").removeClass("imgActive");

        });
        $(".flights").click(function () {
            $(".slice3").addClass("imgActive");
            $(".slice1, .slice2, .slice4, .slice5, .slice6").removeClass("imgActive");

        });
        $(".packages").click(function () {
            $(".slice4").addClass("imgActive");
            $(".slice1, .slice2,.slice3, .slice5, .slice6").removeClass("imgActive");

        });
        $(".cruises").click(function () {
            $(".slice5").addClass("imgActive");
            $(".slice1, .slice2,.slice3, .slice4, .slice6").removeClass("imgActive");
        });
        $(".condos").click(function () {
            $(".slice6").addClass("imgActive");
            $(".slice1, .slice2,.slice3, .slice4, .slice5").removeClass("imgActive");

        });
    });
</script>