Невозможно удалить недавно добавленные элементы из сортируемого списка jQuery 2.0.

0 
<div class="add">Click me to add new item to list</div>
<ul id="sortable">
    <li class="delete">
        <div class="item">these old items can be removed by click on <span class="delBtn">DEL</span></div>
    </li>
    <li class="delete">
        <div class="item">these old items can be removed by click on <span class="delBtn">DEL</span></div>
    </li>
    <li class="delete">
        <div class="item">these old items can be removed by click on <span class="delBtn">DEL</span></div>
    </li>
</ul>


$("#sortable").sortable();

$(".add").click(function () {
    var newItem = '<li class="delete"><div class="item">these <span class="red">new items cannot be removed</span> by click on <span class="delBtn">DEL</span></div></li>';
    $("#sortable").append(newItem);
});

$("#sortable").delegate('.delBtn', 'click', function() {
  alert("A click happened, it was captured at #commonParent and this alert ran");      
});

вместо предупреждения, я хотел бы удалить элемент списка... пожалуйста, помогите мне, как я могу это сделать?!

вы можете попробовать это здесь...

Теги:

3 ответа

0
Лучший ответ

Попробуйте .on вместо этого:

$("#sortable").sortable();

$(".add").click(function () {
    var newItem = '<li class="delete"><div class="item">these <span class="red">new items cannot be removed</span> by click on <span class="delBtn">DEL</span></div></li>';
    $("#sortable").append(newItem);
});

$("#sortable").on('click','.delBtn', function() {
   $(this).parent().remove();
});

Скрипт: http://jsfiddle.net/MvnEv/111/

Поделиться
  • 0
    СПАСИБО! это червь ... (Я пробовал это раньше ... но, очевидно, я сделал что-то не так ... СЕЙЧАС это работает!)
0

Вы можете сделать что-то подобное

$("#sortable").sortable();

$(".add").click(function () {
    var newItem = '<li class="delete"><div class="item">these <span class="red">new items cannot be removed</span> by click on <span class="delBtn">DEL</span></div></li>';
    $("#sortable").append(newItem);
});

$("#sortable").delegate('.delBtn', 'click', function() {
  $(this).closest("div").remove();
});

играть на скрипке

Поделиться
0

ну, если вы используете jquery1. 6+, используйте вместо делегата.

$("#sortable").on('click','.delBtn', function() {
   alert("A click happened, it was captured at #commonParent and this alert ran"); 
   $(this).parents('.delete').remove();
    //or
   $(this).closest('.delete').remove();
});

и remove() чтобы удалить его из DOM.

parents() или closest(), чтобы выбрать элемент li

скрипка здесь

Поделиться
  • 0
    извините ... это решение удаляет только "this", которое ссылается на <span class = "delBtn"> DEL </ span> :-(
  • 0
    хорошо .. я обновил свой ответ .. я думаю, что вы видели это, пока я обновлял ответ. попробуй это сейчас.. :)
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню