javascript - change display:none with jquery with if-else - Stack Overflow

admin管理员组

文章数量:1405581

I've two divs: the div "#Stage" is display="block" and from time to time "display:none". Depending on this I'll appear my second div "#case", default is display="none".

So I tried these two ways:

if ($('#Stage').css('display') == 'none') {
    $('#case').css('display','block')
} // added display:none; to my css file at #case

if ($('#Stage').css('display') == 'none'){
    $('#case').show()
} else if ($('#Stage').css('display') != 'none'){
    $('#case').hide()
}

But both of these methods doesn't work, means the #case div is always on display:none. Does anyone know how to solve it?

THanks

I've two divs: the div "#Stage" is display="block" and from time to time "display:none". Depending on this I'll appear my second div "#case", default is display="none".

So I tried these two ways:

if ($('#Stage').css('display') == 'none') {
    $('#case').css('display','block')
} // added display:none; to my css file at #case

if ($('#Stage').css('display') == 'none'){
    $('#case').show()
} else if ($('#Stage').css('display') != 'none'){
    $('#case').hide()
}

But both of these methods doesn't work, means the #case div is always on display:none. Does anyone know how to solve it?

THanks

• javascript
• jquery
• css

Share Improve this question Follow edited Feb 11, 2013 at 9:28 axel.michel 5,77411 gold badge1717 silver badges2525 bronze badges asked Feb 11, 2013 at 9:26 user2060787user2060787 1

• 1 Can you please add html to the question? – Adil Commented Feb 11, 2013 at 9:40

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 7

I would use :visible to check if the element is shown or not and use show() and hide() method.

if ($('#Stage').is(':visible'))    
    $('#case').show();    
else
    $('#case').hide();

or

if ($('#Stage:visible').length)    
    $('#case').show();    
else
    $('#case').hide();

It could possibly because you're using display:none in the CSS file, and it's taking precedence. Try doing it inline on #case and seeing if that works.

Thanks for your help. My two solutions and the first from Adil was working. It was an ordering conflict with Adobe Edge - edgeActions.js.

本文标签： javascriptchange displaynone with jquery with ifelseStack Overflow