应该jQuery的$(forms).submit(); 不在form标签中触发onSubmit?
我有以下几点:
<script type="text/javascript"> function CancelFormButton(button) { $(button.form).submit(); } </script> <form onsubmit="alert('here');"> <input type="button" value="Cancel" onClick="CancelFormButton(this);" /> </form>
当我点击“取消”button,表单标签上的提交不会被触发。
这行代替提交表单: $(button.form).submit();
但跳过alert('here');
在表单标签的onsubmit内。
这是正确的还是我做错了什么?
顺便说一句,在这种情况下,我想要这个function,但我只是想知道如果我要在触发onsubmit的浏览器中遇到问题。
对不起,误解了你的问题。
根据JavaScript – 调用form.submit()时捕获onsubmit :
最近我被问到:“为什么当我使用javascript提交表单时,form.onsubmit事件不会被解雇呢?
答案:目前的浏览器不遵守html规范的这一部分。 事件只有在用户激活时才会触发 – 并且在被代码激活时不会触发。
(强调加)。
注意: “由用户激活”还包括点击提交button(可能包括默认提交行为从input键,但我没有试过这个)。 我相信,如果你(用代码)点击一个提交button,它会被触发。
这个解决方法将解决@Cletus发现的问题。
function submitForm(form) { //get the form element's document to create the input control with //(this way will work across windows in IE8) var button = form.ownerDocument.createElement('input'); //make sure it can't be seen/disrupts layout (even momentarily) button.style.display = 'none'; //make it such that it will invoke submit if clicked button.type = 'submit'; //append it and click it form.appendChild(button).click(); //if it was prevented, make sure we don't get a build up of buttons form.removeChild(button); }
将工作在所有现代浏览器。
将跨越标签/衍生的子窗口工作(是的,即使在IE <9)。
在香草里!
只要将它传递给一个表单元素的DOM引用,它将确保所有附加的侦听器,onsubmit,和(如果它不阻止的话)最后提交表单。
我想在某些情况下需要这种行为是合理的,但是我认为不会触发表单提交的代码应该(总是)是默认行为。 假设你想用一个表单来提交表单
$("form").submit(function(e){ e.preventDefault(); });
然后对input做一些validation。 如果代码可能触发提交处理程序,则不能包含
$("form").submit()
在这个处理程序中,因为它会导致无限循环(SAME处理程序将被调用,阻止提交,validation和重新提交)。 您需要能够在提交处理程序内手动提交表单而不触发相同的处理程序。
我意识到这并不是直接回答这个问题,但是在这个页面上还有很多关于如何破解这个function的其他答案,我觉得需要指出这一点(对于评论来说太长了)。
我简单的解决scheme
$("form").children('input[type="submit"]').click();
这是我的工作。
尝试在你的函数中触发()事件:
$("form").trigger('submit'); // and then... do submit()
触发器('提交')不工作。使用onSubmit方法不会被解雇。 下面的代码适用于我,使用此代码时调用onSubmit方法:
$("form").find(':submit').click();
几年前我发现了这个问题。
最近我试图“重写”提交方法。 下面是我的代码
window.onload= function (){ for(var i= 0;i<document.forms.length;i++){ (function (p){ var form= document.forms[i]; var originFn= form.submit; form.submit=function (){ //do something you like alert("submitting "+form.id+" using submit method !"); originFn(); } form.onsubmit= function (){ alert("submitting "+form.id+" with onsubmit event !"); } })(i); }
}
<form method="get" action="" id="form1"> <input type="submit" value="提交form1" /> <input type="button" name="" id="" value="button模拟提交1" onclick="document.forms[0].submit();" /></form>
它在IE中完成,但是在其他浏览器中失败的原因与“cletus”
解决这个问题的最简单的解决scheme是创buildtypes为submit和trigger click的“临时”input:
var submitInput = $("<input type='submit' />"); $("#aspnetForm").append(submitInput); submitInput.trigger("click");
代替
$("form").submit()
尝试这个
$("<input type='submit' id='btn_tmpSubmit'/>").css('display','none').appendTo('form'); $("#btn_tmpSubmit").click();