form的submit()方法不能触发onsubmit事件的解决方法,兼容各版本浏览器。
HTML页面设置了Form的onSubmit事件,使用button type="submit" 按钮时,可以正常出发onSubmit方法
如果有一个a标签,点击a标签想要出发form的提交,可以使用 $("#form").submit(),但是submit()方法的调用,不会进入事件onSubmit,原因
当点击a链接的提交时以为会弹出:表单提交了,可是没有,但表单内容是提交了的,但没有触发onsubmit事件。查了下手册,原文如下:
The submit method does not invoke the onsubmit event handler. Call the onsubmit event handler directly. When using Microsoft® Internet Explorer 5.5 and later, you can call the fireEvent method with a value of onsubmit in the sEvent parameter.
关于fireEvent的介绍,可以看这里:http://msdn.microsoft.com/en-us/library/ms536423(v=vs.85).aspx
针对这种情况,加上fireEvent,解决办法如下:
JavaScript 全选
function onSubmit(token) {
var form = document.getElementById("form");
var result;
if (form.fireEvent) {
//IE浏览器
result = form.fireEvent('onsubmit');
} else {
//FIREFOX\CHROME等标准浏览器
var evt = document.createEvent('HTMLEvents');
evt.initEvent('submit', false, true);
result = form.dispatchEvent(evt);
}
if (result) {
form.submit();
}
}
(function ($) {
$(document).ready(function () {
document.getElementById("form").addEventListener('submit', function (event) {
event.preventDefault();
event.stopPropagation();
if (form.checkValidity() === true) {
$("#errorMsg").html(" ")
var username = $('#username').val()
var password = $('#password').val()
var autoLogin = $('#AutoLogin').prop('checked')
if (isNULL(username)) {
GZDialog.alert('用户名不能为空')
return false;
}
if (isNULL(password)) {
GZDialog.alert('密码不能为空')
return false;
}
$.ajax({
type: 'post',
url: $(this).attr("action"),
data: {
username,
password,
autoLogin
},
success: function (data) {
window.location.href = $("#url").val()
},
error: function (res) {
$("#errorMsg").html(res.responseJSON.message)
}
});
}
else {
$("#errorMsg").html('请检查数据有效性!')
}
form.classList.add('was-validated');
}, false);
function isNULL(val) {
return val == undefined || val == null || val == "" || val.length == 0;
}
});
})(jQuery)
版权声明:本文为YES开发框架网发布内容,转载请附上原文出处连接
post 管理员