希望你们中的一些人可以帮助我解决这个问题。
我的应用程序顶部有一些导航链接,它们具有事件和非事件状态。理论上,我想从一个跳转到另一个,如果存在不完整/无效的表单,我会触发验证错误并停留在同一页面上。在我的例子中发生的情况是表单验证工作正常,但顶部的导航链接将状态从非事件状态更改为事件状态(以单击的为准)。
我有一个 ValidateForm 函数,如果表单有效,则验证并提交表单,否则返回 deferred.reject();
function ValidateForm(submitAnyway) {
var deferred = $.Deferred();
var form = $('form');
// if form doesn't exist on the page - quit
if (typeof form[0] === "undefined") return true;
// now check for any validation errors
if (submitAnyway) {
if (!$(form).valid()) {
deferred.reject();
} else {
$(form).submit();
deferred.resolve();
}
} else {
deferred.resolve();
}
return deferred.promise();
}
我有一个针对这些顶部导航链接的点击事件,如下所示:
var DonutsClickEvent = function (e, arg) {
var url = $(this).attr('data');
var data = { param: arg };
if (typeof url === "undefined") return false;
$.when(window.ValidateForm(false)).then(
function () {
LoadPartialView_Main(url, data);
},
function(){
return false; // I'm trying to return false here to stop event from continuing
}
);
Console.log("This statement runs before $.when completes");
// and event continues and the clicked nav button changes
// its state from non-active to active, even though form doesn't validate
}
我最近在我的代码中添加了 $.Deferred 功能,因为一些事件触发的顺序困惑...在我的 validateForm 方法返回 true 或 false 之前,如果 true ,我将继续执行事件,如果 false 我会继续执行事件停下来,一切都很好。
不知道我在这里做错了什么。我将不胜感激任何帮助。
谢谢!
约翰尼
最佳答案
您无法异步决定是否要阻止默认操作。当您获得异步结果时,您的函数已经返回并且默认操作已经发生。
如果您必须异步验证,那么您将必须始终阻止默认操作。如果验证成功,那么您将必须使用 Javascript 手动执行所需的操作。
因此,假设您希望验证成功时发生 LoadPartialView_Main()
,您可以执行以下操作:
var DonutsClickEvent = function (e, arg) {
var url = $(this).attr('data');
var data = { param: arg };
if (typeof url === "undefined") return false;
window.ValidateForm(false).then(function () {
LoadPartialView_Main(url, data);
}, function(err){
// probably show validation error message to the user here
});
// always prevent default action
return false;
}
<小时/>
此外,没有理由将 $.when()
与单个 Promise 一起使用。您只需使用window.ValidateForm(...).then(...)
即可。
关于javascript - 停止事件在 deferred.reject 上继续,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43008781/