javascript - 如何隐藏一个div并禁用里面的链接？

Question

我有一个<div>其中有链接和另一个<div>在第一个下面。

我想让第一个消失，这样:

• 第二个<div>不动。所以 jQuery 函数 .hide()不是我想要的。
• 链接在第一个 div 中变为非事件状态。

是否可以使用 javascript 或 jQuery 做到这一点？

PS:如果不可能，我对其他选项感兴趣:

• 第一个<div>隐藏。
• 第二个<div>逐渐移动。

谢谢，

可乐

编辑 2:

你可以看看这个文件http://jsfiddle.net/XKMEp/5/看看我尝试做什么。

编辑:这是我的尝试

$("#div1").click(function() {       
    /*actus.fadeOut('slow');*/
    actus.fadeTo(1000,0).delay(1001).style.visibility = 'hidden';
    $('input,textarea,select,a', '#div1').attr("disabled", true);
});

即使这样也行不通:

$("#div1").click(function() {       
    /*actus.fadeOut('slow');*/
    actus.fadeTo(1000,0).delay(1001).style.visibility = 'hidden';
    $('input,textarea,select,a', '#div1').attr("disabled", true);
});

假设我的 html 代码是:

<div class="container">
    <div id="div1"></div>
</div>
    <div class="container">
<div id="div2"></div>
</div>


.container{width:300px;height:300px;}

Answer 1

您可能希望使 div 大小相同，但如果您想使用 JavaScript 解决方案，您始终可以使用 removeAttr('href') 来禁用链接并将不透明度更改为 0 . 这将使 div 看起来已被删除，但它仍然存在且高度相同，而无需更改 CSS。

$('#first').on('click', function() {
    $(this).css('opacity', '0');
    $(this).children('a').removeAttr('href');        
}​​​​​​​​);​

这是 jsFiddle solution .如果您将链接存储在数据属性或 ID 或类似的东西中，您也可以重新启用所有内容。