2

Как решить задачу? Нужно найти все отмеченные чекбоксы и удалить их с родителем. Конструкция такая:

javascript

function remove(appendBox) { }

HTML

<a class="btn" onclick="remove('box22')" href="javascript:void(0);">Remove</a>

<div id="box22">
    <div class="unit" data-id="11">
        <input type="checkbox" id="unitObject11" name="unitObject[]" value="11">
        <label for="unitObject11">11</label>
    </div>
    <div class="unit" data-id="56">
        <input type="checkbox" id="unitObject56" name="unitObject[]" value="56">
        <label for="unitObject56">56</label>
    </div>
    <!-- etc... -->
</div>

Спасибо!!!!!

2 ответа 2

2

function remove(appendBox) { 
  var items = document.getElementById(appendBox).querySelectorAll(".unit input[type='checkbox']:checked");
  items.forEach(item => item.closest('.unit').remove());
}
<a class="btn" onclick="remove('box22')" href="javascript:void(0);">Remove</a>

<div id="box22">
    <div class="unit" data-id="11">
        <input type="checkbox" id="unitObject11" name="unitObject[]" value="11">
        <label for="unitObject11">11</label>
    </div>
    <div class="unit" data-id="56">
        <input type="checkbox" id="unitObject56" name="unitObject[]" value="56">
        <label for="unitObject56">56</label>
    </div>
    <!-- etc... -->
</div>

1
  • Спасибо очень четко и коротко!
    – MaXX
    12 авг 2020 в 16:37
1

для того, чтобы выбрать все чекбоксы, нужен селектор

input[type="checkbox"]

Чтобы выбрать только выделенные, нужно добавить селектор :checked

input[type="checkbox"]:checked

Для выбора можно воспользоваться методом .querySelectorAll

для обращения как каждому конкретному элементу в выборке, можно использовать цикл for..of

Для получения родительского элемента служит свойство .parentNode

Чтобы удалить полученный элемент можно использовать метод .remove

1
  • Спасибо за пояснения.
    – MaXX
    12 авг 2020 в 16:43

Ваш ответ

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

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