Javascript 不透明度为0时隐藏div内的可单击链接

我的

HTML

结构如下：

<div class="boxes workshops wrapl">
    <a href="#" id="showw1" class="workshops-button lfloat">Show it</a>
</div>

<div class="boxes exhibitions">
    <a href="#" id="showex1" class="exhibitions-button lfloat">Show it</a>
</div> 
<div class="boxes gallery">
    <a href="#" id="showex1" class="gallery-button lfloat">Show it</a>
</div>

我的

javascript

用于更改

不透明度的代码

    <script type="text/javascript">
    var isHome = true;
        $(function () {

            $("#navi a").click(function() {
                c = $(this).text().toLowerCase();
                isHome = c=="home";
                if (isHome){
                    $('.events-button, .workshops-button, .gallery-button, .sponsors-button, .hospitality-button, .lectures-button, .exhibitions-button').animate({opacity:0.0},500);
                    $(".boxes").animate({opacity: 1.0}, 500 );

                } else {
                    $('.' + c).animate({opacity: 1.0}, 500 );
                    $('.' + c + "-button").animate({opacity: 1.0}, 500 ).addClass('activehack');
                    $('.activehack').not('.' + c + "-button").animate({opacity: 0.0}, 500 );
                    $('.boxes').not('.' + c).animate({opacity: 0.3}, 500 );
                }
            });
        });
</script>


var isHome=真；
$（函数（）{
$（“#navi a”）。单击（函数（）{
c=$（this.text（）.toLowerCase（）；
iHome=c==“家”；
如果（我很好）{
$（'.events按钮、.workshop按钮、.gallery按钮、.赞助商按钮、.hospitality按钮、.讲座按钮、.experiments按钮'）。动画（{opacity:0.0}，500）；
$（“.box”）.animate（{opacity:1.0}，500）；
}否则{
$（'.+c）.animate（{opacity:1.0}，500）；
$（'.+c+“-button”）.animate（{opacity:1.0}，500）.addClass（'activehack'）；
$（'.activehack'）。不是（'.+c+“-button”）。动画（{opacity:0.0}，500）；
$（'.box'）.not（'.+c）.animate（{opacity:0.3}，500）；
}
});
});

当
-按钮
元素不可见时，如何删除
单击
事件

编辑#1
我不必单击
-按钮
元素

当我点击
主页
时，所有的
框
都会出现，但是

$（'a[class=”button“]）。单击（函数（e）{/以解除不必要的处理程序的绑定使用
我知道您已经接受了答案，但问题只是阻止单击事件并不会停止默认行为——“手”当您将鼠标悬停在锚上时，会出现一个图标，表示可单击的内容。实际上，您应该显示/隐藏锚，而不是覆盖单击锚时发生的情况，因为它们本来就不应被单击

下面是一个实际显示/隐藏链接的示例，使链接作为“副作用”而不可点击，但也是用户的预期行为

$（“.boxes a”）.hide（）；
在单击主页链接时添加，隐藏div中的所有锚定标记

单击任何其他导航项目，然后单击
$（'.'.+c+'a'）。show（）时也会使用此选项；
用于显示相关链接。
为什么要使用不透明度而不是隐藏/淡出？@poplaines:因为我想使用淡出和淡出效果。我知道，
fadeIn
和
fadeOut
也是专用的
Jquery
函数。不过，我只是在使用它。淡出和淡出在重新显示元素后隐藏元素设置0%不透明度，这样您就不会有这个问题。我已经在使用不透明度的情况下给出了一个答案。更新了我的答案-有点误读，请检查它是否有效。@poplane:它不起作用。我想您误解了这个问题。我不必单击
-按钮
元素。请查看我编辑的问题。“当按钮元素不可见时，我如何删除它们的单击事件？”如果在它们不可见时单击它们，则不会发生任何事情。当它们再次可见时，单击将起作用。谢谢。我必须接受答案（或最接近的答案）遵守SO的规则。嗯，我确实发布了另一个类似的问题。人们很难理解它。
    <script type="text/javascript">
    var isHome = true;
        $(function () {

            $("#navi a").click(function() {
                c = $(this).text().toLowerCase();
                isHome = c=="home";
                if (isHome){
                    $('.events-button, .workshops-button, .gallery-button, .sponsors-button, .hospitality-button, .lectures-button, .exhibitions-button').animate({opacity:0.0},500);
                    $(".boxes").animate({opacity: 1.0}, 500 );

                } else {
                    $('.' + c).animate({opacity: 1.0}, 500 );
                    $('.' + c + "-button").animate({opacity: 1.0}, 500 ).addClass('activehack');
                    $('.activehack').not('.' + c + "-button").animate({opacity: 0.0}, 500 );
                    $('.boxes').not('.' + c).animate({opacity: 0.3}, 500 );
                }
            });
        });
</script>

$('a[class="button"]').click(function(e){ // <--- don't miss this e
    if ($(this).css('opacity')==0) e.preventDefault();
});