JQuery auf mehrere Ereignisse

Question

Ich weiß, wie eine Funktion zu einem Ereignis befestigen oder auch auf mehrere Ereignisse, verwende ich den Code wie folgt aus:

$(document).off('types_loaded').on('types_loaded',function(e,types){ 
    display_types(types); 
}); 

Und woanders ich dies tun:

$(document).trigger('types_loaded',types); 

Die Variablentypen werden von einem Ajax-Aufruf geladen.

Alles funktioniert gut, aber ich weiß nicht, wie für zwei oder mehr Ereignisse, um so etwas warten:

Typen

$(document).on('types_loaded' **AND** 'other_loaded',function(e,types,other){ 
    display_types(types); 
    display_other(other); 
}); 

und Variablen und andere aus zwei verschiedenen Ajax-Aufrufen comming. Ich studiere die wenn Option, oder gibt es eine andere Möglichkeit, so etwas zu tun?

Answer 1

Da die Aufzählung auf jQuery.on s erste Attribut funktioniert wie ein OR Zustand (es wird ausgelöst, wenn eines der Ereignisse geschieht), können Sie dieses Verhalten AND durch die Verfolgung von welchem ​​Ereignis geschehen war, wie diese verwandeln kann:

window.eventHappened = {}; 
 
$(document).on('types_loaded other_loaded',function(e){ 
 
    console.log(e.type); 
 
    window.eventHappened[ e.type ] = 1; 
 
    if (typeof window.eventHappened['types_loaded'] != 'undefined' && typeof window.eventHappened['other_loaded'] != 'undefined') 
 
    { 
 
    // both happened 
 
    console.log('both happened'); 
 
    } 
 
}); 
 

 
$(document).trigger('other_loaded'); 
 
$(document).trigger('types_loaded');

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

Answer 2

Wenn Ihre Funktionen, die die AJAX Anrufe versprechen zurückkehren, können Sie verwenden $.when:

function getTypes() { 
    return $.ajax(// etc.) 
} 

function getOther() { 
    return $.ajax(// etc.) 
} 

$.when(getTypes(), getOther()).done(function (typesResult, otherResult) { 
    // Both calls have completed 
}); 

Wenn Sie mehr Kontrolle benötigen und wollen Ihr eigenes Versprechen erstellen, können Sie manuell lösen/es ablehnen, wenn die AJAX Antwort kommt zurück:

function getTypes() { 
    // This deferred object will return a promise immediately at the bottom of 
    // this function 

    var dfd = $.Deferred(); 

    $.ajax(// etc.) 
     .done(function(data) { 
      dfd.resolve(data); 
     }) 
     .fail(function() { 
      dfd.reject('Error'); 
     }); 

    // This promise returns to the caller immediately 

    return dfd.promise(); 
    } 

function getOther() { 
    // Same as above 
} 

$.when(getTypes(), getOther()).done(function (typesResult, otherResult) { 
    // Both calls have completed 
});