隐藏然后删除Jquery Draggable Div

时间:2010-08-12 10:09:31

标签: jquery drupal jquery-ui

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

<?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 图形。

有什么想法吗?谢谢!

2 个答案:

答案 0 :(得分:2)

您可以定位父div,即您要关闭的div:

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

答案 1 :(得分:0)

啊......愚蠢的错误,我用});

来过早关闭它

现在工作代码为:

<?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 ...

相关问题