條件不起作用

Question

這裏是我的代碼：

HTML：

<div id="a"> 
    aaa 
</div> 

<div id="b"> 
    <button>hide aaa</button> 
</div> 

<a href="#">link</a> 

JS：

if($('#a:visible').length > 0) { 
    $('a').click(function() { 
     alert('a'); 
    }); 
} 

$('button').click(function() { 
    $('#a').hide(); 
}); 

http://jsfiddle.net/kgj4uw6f/

如果我點擊 「隱藏AAA」，然後我點擊在鏈接上顯示警報。 #a隱藏時，我不想顯示警報。我如何更改我的代碼？

Answer 1

它從裏到外。點擊發生時您必須查看可見性。

$('a').click(function() { 
 
    if ($('#a:visible').length > 0) { 
 
    alert('a'); 
 
    } 
 
}); 
 

 
$('button').click(function() { 
 
    $('#a').hide(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="a"> 
 
    aaa 
 
</div> 
 

 
<div id="b"> 
 
    <button>hide aaa</button> 
 
</div> 
 

 
<a href="#">link</a> 
 
JS:

Answer 2

我得到它的工作改變你的條件click事件裏面，像這樣：

$('a').click(function() { 
    if($('#a:visible').length > 0) { 
     alert('a'); 
    } 
}); 

$('button').click(function() { 
    $('#a').hide(); 
}); 

http://jsfiddle.net/kgj4uw6f/2/

Answer 3

這裏做的另一種方式！您可以使用$(element).is(":visible")來檢查元素的可見性。

$('a').click(function() { 
    if($('#a').is(":visible")) { 
     alert('a'); 
    } 
}); 


$('button').click(function() { 
    $('#a').hide(); 
});