简体   繁体   English

jQuery隐藏div并显示div

[英]Jquery hide div and show div

I have my code on jsfiddle which has 2 divs, where the user can select features by clicking on a div. 我在jsfiddle上有2个div的代码,用户可以通过单击div来选择功能。 in the opposite div i have the same item but hidden. 在对面的div中,我有相同的项目,但隐藏。 how can i replace the hidden class? 如何替换隐藏类?

this is what i have come up with: 这是我想出的:

$("#Label1").click(function () {
    $(this).find('.feature-options1').addClass('hidden');
    $(this).parent().closest('.feature-container').prev().find('#SelectedFeatures').find('#Label2').removeClass('hidden');
});

http://jsfiddle.net/X6xcj/9/ http://jsfiddle.net/X6xcj/9/

is this: 这是:

$(this).find('.feature-options1').hide();
$('#label2').find('.feature-options1').show();

what you are trying to achieve? 您正在努力实现什么?

You should use .parent() not .prev() to get the containing div 您应该使用.parent()而不是.prev()来获取包含的div

$("#Label1").click(function () {
    $(this).find('.feature-options1').addClass('hidden');
    $(this).parent().closest('.feature-container').parent().find('#SelectedFeatures').find('#Label2').removeClass('hidden');
});

Here you go: http://jsfiddle.net/5W48X/ 您可以在这里: http : //jsfiddle.net/5W48X/

.prev() gives you the previous sibling element. .prev()为您提供上一个同级元素。

.parent() gives you the container (parent) element. .parent()为您提供容器(父)元素。

EDIT: 编辑:

I had not even seen the id's you use on divs yet. 我什至没有看到您在div上使用的ID。 This should work as well: 这也应该工作:

$("#Label1").click(function () {
    $(this).addClass('hidden');
    $('#Label2').removeClass('hidden');
});

http://jsfiddle.net/6Zbsa/ http://jsfiddle.net/6Zbsa/

 $("#Label1").click(function () {
            $(this).find('.feature-options1').addClass('hidden');
            $(this).parent().next().next().find('#Label2').removeClass('hidden');
        });

Try this i may help you. 试试这个我可能会帮助您。

try this: 尝试这个:

$(function(){
    $(".feature-addons").on('click', function(e){
        var lbl = $(this).next();
        $(".feature-addons").next().addClass('hidden');
        lbl.removeClass('hidden');
    });
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM