0

Как можно удалить весь item при нажатии на кнопку "Удалить"? Этих итемов может быть неограниченное количество.

<div class="item">
    <div class="right floated content">
      <a class="ui red basic button del-bookmark" data-bk="{{ book.id }}" data-pg="{{bookmark.page_id}}">Удалить</a>
    </div>
    <i class="book icon bookmark-link"></i>

    <div class="content bookmark-link">
      <a href="../book/{{book.id}}?page={{bookmark.page_id}}">Страница {{bookmark.page_id}}</a>
    </div>
  </div>
2
  • А что это за шаблонизатор? Не angular?
    – vp_arth
    1 фев 2017 в 10:48
  • @vp_arth django 1 фев 2017 в 14:55

3 ответа 3

6
$(".del-bookmark").click(function(){ 
  $(this).closest(".item").remove(); 
  return false; 
});
1

Ну и ещё до кучи:

template:

<div class="item" id="item_{{book.id}}_{{bookmark.page_id}}">
<div class="right floated content">
  <a class="ui red basic button del-bookmark" data-bk="{{ book.id }}" data-pg="{{bookmark.page_id}}">Удалить</a>
</div>
<i class="book icon bookmark-link"></i>

<div class="content bookmark-link">
  <a href="../book/{{book.id}}?page={{bookmark.page_id}}">Страница {{bookmark.page_id}}</a>
</div>

js:

$(".del-bookmark").click(function(){ 
  $('#item_'+$(this).data('bk')+'_'+$(this).data('pg')).remove();
  return false; 
});
1

Еще как вариант:

$(".del-bookmark").click(function (e) { 
    removeEl(e.target);
    return false;
});

function removeEl(el) {
    $(el).parent().parent().remove(); 
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="item">
    <div class="right floated content">
      <a class="ui red basic button del-bookmark" data-bk="{{ book.id }}" data-pg="{{bookmark.page_id}}">Удалить</a>
    </div>
    <i class="book icon bookmark-link"></i>

    <div class="content bookmark-link">
      <a href="../book/{{book.id}}?page={{bookmark.page_id}}">Страница {{bookmark.page_id}}</a>
    </div>
  </div>

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.