javascript - 从类中删除 onclick 按钮

Question

onclick 的 class 为 obliterate 的按钮，我想让我的以下代码采用一堆相同的按钮，除了它的唯一的id，然后将其删除。按钮可以通过innerHTML随时接受用户输入。我想在确认后删除按钮onclick这是我当前的代码:

document.getElementsByClassName('obliterate').onclick = function() {
      if (confirm('Are you sure you want to delete this?')){
         //get this then remove it with remove(this.id);
    }
}

Answer 1

应该是直接的，将事件处理程序附加到元素，删除元素

var elems = document.querySelectorAll('.obliterate');

for (var i=0; i<elems.length; i++) {
    elems[i].addEventListener('click', function() {
        if ( confirm('Are you sure you want to delete this?') ) {
            this.parentNode.removeChild(this);
        }
    }, false);
}

<小时/>

如果页面加载时不存在这些元素，则必须进行委托(delegate)，并且在没有库的情况下执行此操作可能会有些复杂，具体取决于您要匹配的选择器、单击的元素内是否有子元素等。但这里有一个简化版

document.addEventListener('click', function(event) {
    var clicked = event.target;
    var elems   = [].slice.call(document.querySelectorAll('.obliterate'));

    if ( elems.indexOf(clicked) !== -1 ) {
        if ( confirm('Are you sure you want to delete this?') ) {
            clicked.parentNode.removeChild(clicked);
        }
    }
}, false);

FIDDLE