如何拦截onclick事件

Question

我希望能够在页面从onclick提交回来之前，拦截一个按钮（非提交按钮）的onclick事件。

我遇到了一些问题：

$(document).ready() { function() {
    function validate() { 
        ...
    }

    var oldOnClick = $("input[value=OK]").attr("onclick");
    $("input[value=OK]").attr("onclick", "if(!validate()) { return false; }" + oldOnClick));
});

- LB.

Answer 1

如果您仍然希望处理按钮点击事件而不是表单提交事件，就像所有建议的那样，您可以这样做，使用匿名函数来调用您的oldOnClick函数，保留上下文和事件参数：

$(document).ready(function () {
  function validate() { 
    // ...
  }

  var oldOnClick = $("input[value=OK]").get(0).onclick;
  $("input[value=OK]").click(function (e) {
    if(!validate()) {
      return false;
    }
    oldOnClick.call(this, e); // enforce the context and event argument
  });
});

- Christian C. Salvadó

---

这正是我想要的。虽然它仍然会回传，但我可以从这里工作。 - LB.

我在分配新的点击事件之前取消了onclick事件的绑定。这样做起作用了。再次感谢！ - LB.

Answer 2

与其试图拦截onClick事件，您应该使用提交事件。

为什么？简单，不是所有的表单都是通过点击提交的，那么tab、enter等呢？

$("form").submit(function() { // 在此处进行验证/其他操作 });就可以解决问题了。

您可以return false;以停止表单提交，或者return true;如果您想让它通过。在.submit内执行验证。

- jakeisonline

---

这是文档化的操作方式，所以要么是ASP非常麻烦，要么就是你的代码有误。尝试保持简单，例如 $("form").submit(function() { alert('Hello world.'); return false; }); 这样可以阻止提交并通过JS警报进行提示。 - jakeisonline

Jakeisonline说得对 - 很容易被误以为每个人使用你的页面的方式都和你一样（即，用鼠标单击）。但这并不总是事实。 - BryanH

这个方法不起作用的原因是按钮不是一个提交按钮，他们使用onclick事件来提交。 - LB.

我已经编辑了问题。我正在尝试拦截一个按钮的onclick事件（不是提交表单按钮或相关的提交表单行为）。 - LB.

Answer 3

e.preventDefault();

更具体地说，您需要做到这一点。

$("#Your_form_id").submit(function(e) {
e.preventDefault();
// your code
});

另一种方法是像Jake所说的那样，在完成一些工作后返回false...即：

$("#Your_form_id").submit(function() {
// your code
return false;
});

请参阅Jquery文档中关于提交和事件的一般信息。

- Sean Vieira

Answer 4

在提交表单之前会调用OnSubmit函数。 您甚至可以取消该事件，以便不提交表单。

- wtaniguchi