-1

JavaScript を使用してクライアント側で実行され、サーバー側でファイルの存在をチェックする関数を作成したいと考えています。このようにAjaxを使ってみます。

function ROIFileExists(){
    var fileAlreadyExists=undefined;

    jQuery.ajax({
        type: "POST",
        url: "ROIFileExists.php",
        data: { FileName: fileName},
        cache: false
        }).done(function( result ) {
            fileAlreadyExists = (result!==0);
            console.log('fileAlreadyExists='+fileAlreadyExists);
    }); 

    return fileAlreadyExists;
}

問題は、Ajax は非同期であるため、通常、Ajax ブロックによって設定される前にfileAlreadyExists(として) 返されることです。undefined

4

2 に答える 2

5

コールバックまたは独自の を使用しますPromise。

コールバックのアプローチは次のとおりです。

function ROIFileExists(callback){
// --------------------^ Accept the function to call back as an arg

    jQuery.ajax({
        type: "POST",
        url: "ROIFileExists.php",
        data: { FileName: fileName},
        cache: false
        }).done(function( result ) {
            var fileAlreadyExists = (result!==0);
            console.log('fileAlreadyExists='+fileAlreadyExists);
            callback(fileAlreadyExists);
// ---------^ Call it
    }); 
}

使用法：

ROIFileExists(function(exists) {
    console.log("Exists? " + exists);
});

Promiseアプローチは次のとおりです。

function ROIFileExists(){
    var d = new $.Deferred();                   // Create the deferred object

    jQuery.ajax({
        type: "POST",
        url: "ROIFileExists.php",
        data: { FileName: fileName},
        cache: false
        }).done(function( result ) {
            var fileAlreadyExists = (result!==0);
            console.log('fileAlreadyExists='+fileAlreadyExists);
            d.resolve(fileAlreadyExists);       // <=== Resolve it
    }); 

    return d;                                   // <=== Return it
}

使用法：

ROIFileExists().done(function(exists) {
    console.log("Exists? " + exists);
});

を使用しないことを強くお勧めしasync: falseます。これにより、ユーザー エクスペリエンスが低下し、通話中にブラウザーの UI がロックされます。jQuery の将来のバージョンではなくなる予定です (XMLHttpRequest自分で使用する必要があります)。async: false同様のニーズがある場合は使用できませんが、JSONP を使用している場合は使用できません。

いずれにせよ、ブラウザー上の JavaScript コードはイベント駆動型であるため、そのイベント駆動型の性質 (この場合、ファイルに関する情報を取得するイベント) を採用するのが通常の方法です。

于 2013-07-20T15:27:04.600 に答える
2

async: false関数によって結果が返されることを保証するために使用できます。(注: async: falseは最適ではありません。以下のように、コールバックをサポートするようにアプリケーションのアーキテクチャを変更できる場合は避ける必要があります。)

function ROIFileExists(){
    var fileAlreadyExists=undefined;

    jQuery.ajax({
        async: false,   // Add this line
        type: "POST",
        url: "ROIFileExists.php",
        data: { FileName: fileName},
        cache: false
        }).done(function( result ) {
            fileAlreadyExists = (result!==0);
            console.log('fileAlreadyExists='+fileAlreadyExists);
    }); 

    return fileAlreadyExists;
}

ただし、コールバック関数を使用することをお勧めします。

function ROIFileExists(callback){
    jQuery.ajax({
        type: "POST",
        url: "ROIFileExists.php",
        data: { FileName: fileName},
        cache: false
        }).done(function( result ) {
            callback(result!==0);
       });
}
于 2013-07-20T15:26:16.587 に答える