html行为只触发一次,如何使用Javascript addEventListener()来覆盖HTML Form默认的submit()行为...

如何使用addEventListener()为HTML表单的Submit按钮分配处理程序，类似于对按钮的'onclick'属性的赋值，而不触发表单的默认submit()行为？

我可以将“自定义”功能分配给“提交”按钮的“onclick”属性。自定义函数执行各种步骤，然后创建Ajax请求对象并使用它将数据发送到服务器。不会触发默认的submit()行为。

submitButton.onclick = function() {

mySubmit();

return false;

};

function mySubmit() {

//do stuff

notTheDefaultUrl = generateNonStandardUrl();

request = GetStandardAjaxRequestThingamabob();

request.open("POST", notTheDefaultUrl, true);

request.onreadystatechange = myHandler;

request.send(formData);

return false;

}但是使用addEventListener()，浏览器提交请求两次 - 一次在Ajax请求对象下，再次使用默认的HTML表单submit()行为。 (我可以告诉b/c mySubmit函数将数据发送到与默认值不同的URL - 但默认和Ajax URL都出现在服务器日志中。)

var func = window['mySubmit'];

submitButton.addEventListener('click', func, false);我知道分配给按钮的函数必须返回'false'以防止触发默认的submit()行为。我以为mySubmit()做到了这一点，我试图通过addEventListener编写传入的函数来更明确地返回false(而不是'func'，'function(){mySubmit(); return false}')但这些dosn也没工作。

那我该怎么做？

UPDATE

对Peter的评论提出了一些浏览器兼容性问题;另外，IE不支持addEventListener()。此代码解决了这些问题我在Firefox和IE 8中测试过它。

function func( event ) {

if ( event.preventDefault ) { event.preventDefault()};

event.returnValue = false;

// do whatever

}

if (submitButton.addEventListener) {

submitButton.addEventListener('click', func, false);

}

else {

submitButton.attachEvent('onclick', func);

}为凌乱的新手格式道歉。