JavaScript的jQuery中prev().remove()方法不生效问题求解

问题原因 #

你写的点击事件绑定逻辑仅作用于页面初始加载时就已存在的.cross元素，后续通过表单提交动态追加的叉号图片没有被绑定上点击事件，因此功能无法触发。

解决方案 #

将点击事件绑定改为事件委托模式，绑定到你用来存放列表项的固定父容器$list上即可，事件委托会通过事件冒泡匹配所有符合规则的子元素，不管子元素是初始加载还是后续动态新增的都能触发事件：

$newform.on('submit', function(e) {
    e.preventDefault();
    var text = $newform.find('input:text').val();
    var url = document.getElementById('addurl').value;
    $list.append('<li class="links"><a href="'+ url +'"><div class="spann">' + text +'</div></a></li>');
    $list.append('<img src="images/close.png" class="cross">');
});

// 绑定到已存在的父容器$list，委托匹配.cross元素触发事件
$list.on('click', '.cross', function() {
    $(this).prev().remove();
    $(this).remove();
});

内容的提问来源于stack exchange，提问作者Sahil Handique