Скрыть затем удалить Jquery Draggable Div

Question

Я использую Jquery для некоторых перетаскиваемых div-ов в Drupal, и все это прекрасно работает. Мне просто нужно иметь возможность закрыть 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>

Я хочу закрыть родительский div cc-drag, когда пользователь нажимает cc_close, представляющее собой X рисунок в углу.

Есть идеи? Спасибо!

Answer 1

Вы можете просто выбрать родительский div, который вы хотите закрыть:

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

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