Question

这是我的代码。

var elems = document.querySelectorAll('.confirmation');
elems.forEach(element => {
  element.addEventListener('click', function(e) {
    return confirm('Are you sure you want to delete it?');
  });
});

$('.confirmation').on('click', function() {
  return confirm('Are you sure?');
});

它的作用是抓取某些元素并停止在后端运行的delete函数。现在。它适用于jQuery版本。它在Vanilla版本中不起作用。在Vanilla中，即使我在确认框中单击取消，它仍会删除该字段。另一方面，JQuery会停止代码。

我在香草JS中做错了什么或者jQuery是否有一些魔法＆＃39;在后台？

Answer 1

不是确认，它的工作方式相同;它是关于jQuery提供的语法糖。这是关键的区别：

从事件处理程序返回false（使用jQuery设置）将自动调用event.stopPropagation()和event.preventDefault()。

相反，使用本机API设置的事件侦听器不具备此功能。要使用它，您必须稍微修改一下代码：

element.addEventListener('click', function(e) {
  var confirmation = confirm('Are you sure you want to delete it?');
  if (!confirmation) {
    e.stopPropagation();
  }
});

它是stopPropagation()，而不是preventDefault()，因为我假设删除代码实际上是另一个click处理程序集，在永远存在的父元素上使用委托技术。

jQuery确认vs vanilla JS确认

1 个答案: