Question

在网站中实施了一段第三方插件，提示用户在删除之前进行确认。

confirmDelete: function (event) {
    var go_ahead = confirm("Are you sure you want to delete this draft? This action cannot be undone.");
    if (go_ahead) {
        return;
    } else {
        event.preventDefault();
    }
}

在我自己的js文件中，我想知道用户是否点击了＆＃34;取消＆＃34;或者＆＃34;好的＆＃34;。

我可以告诉用户提示确认窗口的时间（通过他们点击删除按钮），但我无法确定用户是否点击了取消或确定。

我希望将此代码保持独立，因为附加组件会定期更新。

$('button[name="delete"]').on('click', function(event) {
    console.log('delete btn clicked');
    console.log(event);
});

我通过我的控制台中的事件内容，但没有任何事情发生在我身上。

Answer 1

将调用confirm的值返回到onClick处理程序，例如

var SomeObject = {
  confirmDelete: function () {
    return confirm("Are you sure you want to delete this draft? This action cannot be undone.");
  }
};

然后：

$('button[name="delete"]').on('click', function(event) {
    var confirmed = SomeObject.confirmDelete();
    if (!confirmed) {
        event.preventDefault();
        return;
    }

    // etc...
});

我从确认功能中删除了事件。这使它接近实际事件，似乎更规范的jQuery。它提高了可读性并简化了测试。

Answer 2

另一种选择

如果窗口小部件为按钮分配事件侦听器，则所选答案将不起作用。这似乎很可能基于提供的代码。它将显示两个确认对话框，这非常令人困惑。

作为一种解决方法，OP可能会覆盖窗口确认方法。替换方法可以拦截消息和结果。虽然我不提倡重写本机方法，但这是一个务实的解决方案，我已经成功地使用了遗留系统。

运行代码段以尝试

＆＃13;

var confirm2 = window.confirm;

window.confirm = function(message) {

  var result = confirm2(message);

  debug.innerHTML += 'confirm: ' + message + '\nresult = ' + result + '\n';

  return result;

}


// Simulate 3rd Party Widget
var widget = (function() {

  var methods = {
    confirmDelete: function(event) {
      var go_ahead = confirm("Are you sure you want to delete this draft? This action cannot be undone.");
      if (go_ahead) {
        return;
      } else {
        event.preventDefault();
      }
    }
  }

  document.getElementsByName('delete')[0].addEventListener('click', methods.confirmDelete);

  return methods;

})();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button name="delete">Delete</button>
<xmp id="debug"></xmp>

＆＃13;

Javascript确认，捕获用户选择

2 个答案:

另一种选择