如何拦截<button>标签上的点击并停止提交?

时间:2016-02-26 12:58:24

标签: javascript jquery html button confirm

我有一个带有一些按钮标签的表单,其中一个是删除按钮。我想拦截点击并询问确认。 我可以使用下面的代码拦截它,但无论我回答什么,它都会处理。

HTML:

<button type=submit id=mydelbuttonid value=delete name=deletebutton>Delete</button>

jQuery的:

$('button#mydelbuttonid').on("click", function(e) {
  if (confirm('Are you sure you want to delete this record?')) {
    alert('deleting');
  }
  else {
    alert('not deleting');
    event.preventDefault();
    return false;
  }
});

我收到正确的警告,但无论如何都会删除记录。

任何人都知道如何解决这个问题?我已经在互联网上搜索了很长时间,并为<a>个代码找到了很多解决方案,但<button>个代码都没有。

1 个答案:

答案 0 :(得分:3)

正如@ A.Wolff正确指出的那样,e !== event ......

event更改为e或反之亦然,preventDefault实际上会被触发(之后return false会变得多余)。

$('button#mydelbuttonid').on("click", function(e) {
  if (confirm('Are you sure you want to delete this record?')) {
    alert('deleting');
  }
  else {
    alert('not deleting');
    e.preventDefault();
    /*return false;*/
  }
})