3

我有几种形式，如下所示：

<form id=myForm onsubmit="saveFormData(this);return false">
....
</form>

提交后，执行自定义函数并取消默认操作（通过 http 发送数据）。

但是现在我需要验证表单，如果验证成功，则触发自定义函数（saveFormData在这种情况下，但对于其他表单可能会有所不同），否则什么也不做。

所以最终的事件处理程序应该像这样工作：

$('#myForm').submit(function(){
    if(formValidatesOk(this))
        saveFormData() ;
    return false ;
}

但是，我无法对 HTML 代码进行更改，因此我需要一种通用方法，通过使用 jquery 事件处理程序包装硬编码处理程序来重新定义 onsubmit 事件。

我首先想到的是（未经测试）：

var hardcodedHandler = $('#myForm').prop('onsubmit') ; // save the current handler
$('#myForm').prop('onsubmit',null) ; // remove the current handler
$('#myForm').submit(function(){
    if(formValidatesOk(this)) // if the form is valid then...
        Function(hardcodedHandler).call(this) ; // trigger the original handler
    return false ;
}) ;

但这不是很优雅（至少可以这么说）。

你知道更好的方法吗？

4

2 回答 2

4

您可以只从onsubmit元素的属性中获取旧功能，您不需要eval它：

var form = $('#myForm');
var oldHandler = form.prop("onsubmit");
form.removeProp("onsubmit").submit(function(e){
    e.preventDefault();
    if(formValidatesOk(this))
        oldHandler.call(this, e);
});

jsfiddle.net 上的演示

于 2012-12-20T07:01:47.207 回答
0

事件是不可预测的（以它们被触发的方式）。我认为受制于他们的搬运工也不能依赖秩序。因此，将处理程序绑定到更改先前添加的处理程序的事件肯定是（非常）不好的做法。实际上，正如您所建议的，您永远无法确定首先触发哪个处理程序。毕竟，事件不应该相互通知。应该使用事件和处理程序来避免代码的高度耦合。

解决这个问题的最好方法（考虑到你的限制）是用新的行为来装饰你的“旧”处理程序。Bergi 发布了一个很好的例子。

于 2012-12-20T07:12:24.307 回答