Question

关于在javascript中同步执行onblur和onclick事件处理程序，我有一个很小但非常重要的问题。

实际上我有一个包含一个文本框和一个提交按钮的html表单。 onblur放在文本框上，这个处理程序执行一个名为ajexValidation（）的方法。提交按钮与onclick hndler相关联，后者执行ajexSubmitData（）。在这两种情况下都使用Ajex处理程序，因为输入日期用于从远程服务器验证自身并返回经过验证的数据并在文本字段中分配数据。

在onclick处理程序的情况下，将验证的数据提交给远程服务器以查询其他详细信息。

这是页面的常见流程。

但是有一些问题..

当用户点击提交按钮时，首先打开onblur，然后点击onclick。

现在服务器上的数据处于验证过程中并且onclick开始执行ajexSubmitData（），这会导致问题，因为进程是 - 首先验证dat，然后将验证的数据发送到服务器进行查询，你可以说偶数同步问题。

所以我需要的是跟踪onblur方法完成通知并暂停执行中的onclick methed并等待该通知。获得通知后，再触发ajexSubmitData（）。

任何帮助都会受到高度关注，

-rajneesh

Answer 1

为什么不在发送的同一方法中验证。只是一个想法。另一个想法是始终保持提交按钮禁用，直到所有内容都得到验证。

Answer 2

你可以这样做：

var globalFlag = WAITING;
function onBlur_validateData() { // your "AjexValidation"
    sendAjaxRequest( function(data) { // this is the call back on ajax request completion
        if( data was valid )
            globalFlag = VALID;
        else
            globalFlag = INVALID;
    });
}

function onClick_submitData() { // wrapper around your "ajexSubmitData"
    if( globalFlag==WAITING )
        setTimeout( onClick_submitData, 200 );
    else if( globalFlag==INVALID )
        alert( "Your input was invalid!" );
    else ajexSubmitData();
}

function ajexSubmitData() {
    // do your stuff
}

现在，globalFlag可能是对象的一部分，也可能是全局可访问的任何内容。

此外，请确保单击提交按钮后将被禁用。

注意setTimeout调用如何在线程中创建“递归循环”。这将使您的UI在代码等待验证完成时不会挂起。

干杯，

JRH。

Answer 3

为什么不使用form.onsubmit事件来激活验证代码并让验证调用提交函数，如果成功的话？这样你可以覆盖默认提交，如果你没有Javascript仍然有退回到标准提交的路线？

Javascript事件同步问题

3 个答案: