0

基本的にメッセージを送信し、続行するには応答を待つ必要があるカスタム js モジュールを作成しました。

var manageBooking = (function (jQ) {

//decalre private variables
var domain, msgRecieved, msgResponse, validationValue;
//decalre private functions
var sendMessage, wait;

// A private variables
domain = document.domain;
msgRecieved = false;
msgResponse = null;


wait = function(timeOutStep){
    var w;
    console.log('msgRecieved', msgRecieved);
    if (msgRecieved === true) {
        clearTimeout(w);
        return;
    } else {
        console.log('waiting..');
        w = setTimeout(wait, timeOutStep, timeOutStep);
    }
}

// A private function to send messages
sendMessage = function( requestURL, data, type ) {
    console.log(requestURL);
    console.log(data);
    console.log(type);
    //reset vars to defaults
    msgRecieved = false;
    msgResponse = null;
    jQuery.ajax({
        url: "http://"+domain+"/_ajax/"+requestURL,
        dataType: "html",
        async: true,
        data: data,
        type: type,
        success: function(msg){
            console.log(msg);
            msgResponse = msg;
            msgRecieved = true;
        }
    });
    console.log('after ajax call');
    wait(500);
    console.log('after wait');
    console.log('msgRecieved', msgRecieved);
    return;
};
return {

// A public variable
errorMsg: "",
validationName: "",
bookingID: "",
output: "",
// A public function to login
login: function( enteredBookingID, enteredSurname ) {
    // Call private sendMsg
    sendMessage("user_login/"+enteredBookingID+"/"+enteredSurname, null, 'GET');
    console.log(msgResponse);
    throw "error";
    //check response
    var patt=/Sorry/i;
    //test pattern
    var result=patt.test($.trim(msgResponse));
    //if false OK
    if (result === false) {
        var split = msgResponse.split('|');
        validationName = split[0];
        validationValue = split[1];
        bookingID = enteredBookingID
        return true;
    }
    //else error
    errorMsg = msgResponse;
    return false;
}
};
})(jQuery);
manageBooking.login(123,123);

私が抱えている問題は、ajax が完了して truesendMessageに設定されるまで関数を強制的に待機させることです。msgRecieved

ただし、関数が関数に一度sendMessageヒットしてwaitから続行するようです。次のコンソール出力は、イベントの順序を示しています。

GET http://website/_ajax/user_login/123/123
after ajax call //sendMessage()
msgRecieved, false //wait()
waiting.. //wait()
after wait //sendMessage()
msgRecieved, false //sendMessage()
null//login()
uncaught exception: error //login() 
<p>Sorry, we cannot locate your details.  </p> <!-- jQuery Ajax call -->
msgRecieved, true //wait()

私が混乱しているのは、wait関数が最後に再び起動するように見えることです..

これを機能させるための指針を誰かに教えてもらえますか?

4

3 に答える 3

0

JavaScript は非同期で動作します。つまり、待機しません

コードには次のような部分があります。

jQuery.ajax({
    url: "http://"+domain+"/_ajax/"+requestURL,
    dataType: "html",
    async: true,
    data: data,
    type: type,
    success: function(msg){
        console.log(msg);
        msgResponse = msg;
        msgRecieved = true;
    }
});

success次のように、応答が関数内に到着したときに実行されるコードを配置する必要があります。

success : function (msg) {
    handleMessage(msg); // Or any other manipulation to the received message
}

function handleMessage(msg) {
    // Work with your received message here.
}

success受信したメッセージで呼び出されます。これはコールバックです。

実装する正しい方法sendMessageは、次の方法です。

sendMessage = function( requestURL, data, type, callback ) {
    console.log(requestURL);
    console.log(data);
    console.log(type);
    //reset vars to defaults
    msgRecieved = false;
    msgResponse = null;
    jQuery.ajax({
        url: "http://"+domain+"/_ajax/"+requestURL,
        dataType: "html",
        async: true,
        data: data,
        type: type,
        success: function(msg){
            console.log(msg);
            msgResponse = msg;
            msgRecieved = true;
            // Call the callback function to notify the message
            // was received
            callback();
        }
    });
};

そしてそれを次のように使用します:

sendMessage(urlHere, dataHere, typeHere, function () {
    // Message has been received, msgResponse and msgReceived
    // have already been updated. Do what you need here
});
于 2013-04-05T09:41:24.230 に答える
0

setTimeout の代わりに JavaScript の setInterval 関数を使用してみてください。しかし今回は、sendMessage を分割し、setInterval の下に ajax メッセージを受信した後に実行する必要がある部分を配置します。

ajax メッセージが受信されると、sendMessage のこの 2 番目の部分が実行され (messagereceived が true になった後)、間隔もクリアされます。

これは、setTimeout() が設定された間隔の後に 1 回だけ実行されるためです。

setInterval() はクリアされるまで繰り返し実行します。

詳細はこちら

お役に立てれば!

于 2013-04-05T09:40:34.793 に答える
0

問題は変数のスコープに関連している可能性がありますw。これは、2 回目の呼び出し (wait 関数で、elseブランチへ) で、以前に作成したタイムアウトへの参照を破棄しているため、clearTimeout が機能しないためです: 定義してみてくださいそれはすぐ外側の範囲にあります。

于 2013-04-05T09:40:46.373 に答える