隐藏然后删除一个 Jquery Draggable Div答案

【问题标题】：Hide Then Remove a Jquery Draggable Div隐藏然后删除一个 Jquery Draggable Div
【发布时间】：2010-08-12 10:09:30
【问题描述】：

我在 Drupal 中将 Jquery 用于一些可拖动的 div，一切都很好。我只需要能够在不再需要时关闭 div / 框。这是我的代码：

<?php
drupal_add_js('
$(document).ready(function() {
  $(".cc-drag").draggable({ stack: ".cc-drag", axis: "x" });
});

    $(".cc_close").click(function () {
      $(this).hide(2000, function () {
        $(this).remove();
      });
    });

','inline');
?>

<div class="cc-drag">
    <div class="cc_top">
    <div class="cc_close">&nbsp;</div>
    <div class="cc_content">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque elit dolor, ornare non vulputate quis, dictum ut neque. 
    Nunc non velit at nulla posuere pulvinar. Maecenas vitae diam iaculis lorem sagittis condimentum et at elit. 
    Praesent ac augue dolor. 
    Sed sit amet orci leo, vitae sagittis ante. 
    Phasellus id volutpat nibh. 
    Nam ullamcorper mi at urna cursus vitae aliquet est ullamcorper.
    </div>
    </div>
<div class="cc_bottom"></div>
</div>

<div class="cc-drag">
    <div class="cc_top">
    <div class="cc_close">&nbsp;</div>
    <div class="cc_content">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque elit dolor, ornare non vulputate quis, dictum ut neque. 
    Nunc non velit at nulla posuere pulvinar. Maecenas vitae diam iaculis lorem sagittis condimentum et at elit. 
    Praesent ac augue dolor. 
    Sed sit amet orci leo, vitae sagittis ante. 
    Phasellus id volutpat nibh. 
    Nam ullamcorper mi at urna cursus vitae aliquet est ullamcorper.
    </div>
    </div>
<div class="cc_bottom"></div>
</div>

<div class="cc-drag">
    <div class="cc_top">
    <div class="cc_close">&nbsp;</div>
    <div class="cc_content">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque elit dolor, ornare non vulputate quis, dictum ut neque. 
    Nunc non velit at nulla posuere pulvinar. Maecenas vitae diam iaculis lorem sagittis condimentum et at elit. 
    Praesent ac augue dolor. 
    Sed sit amet orci leo, vitae sagittis ante. 
    Phasellus id volutpat nibh. 
    Nam ullamcorper mi at urna cursus vitae aliquet est ullamcorper.
    </div>
    </div>
<div class="cc_bottom"></div>
</div>

当用户点击 cc_close 时，我想关闭父 div cc-drag，这是角落中的 X 图形。

有什么想法吗？谢谢！

【问题讨论】：

标签： jquery drupal jquery-ui

【解决方案1】：

您可以只定位父 div，也就是您要关闭的那个：

$(".cc_close").click(function () {
  $(this).parent().hide(2000, function () {
    $(this).remove();
  });
});

【讨论】：

您好 googletorp，感谢您的回答，仍然无法关闭它。我尝试将其更改为其他选择器 - cc_top（zz 顶级致敬乐队？）、cc_content 等，但没有运气。

【解决方案2】：

啊...愚蠢的错误，我关闭它太早了，});

现在的工作代码如下：

<?php
drupal_add_js('
    $(document).ready(function() {
      $(".cc-drag").draggable({ stack: ".cc-drag", containment: "#page-wrapper" });


    $(".cc_close").click(function () {
      $(this).parent().hide(2000, function () {
        $(this).remove();
      });
    });

    });
','inline');
?>

感谢您的帮助 googletorp...

【讨论】：