Comment déclencher un événement javascript personnalisé dans IE8?

Je suis en train de déclencher un événement personnalisé sur IE8 et tripoter une solution de ici et ici. Mais je ne peux pas le faire fonctionner...

Je suis à l'aide de jquery mobile avec requireJS et google analytics. Je suis donc suivi le JQM pageshow événement. Toutefois, depuis requireJS charge des scripts async, ma liaison à pageshow doit être faite dans un javascript "wrapper", sinon il va produire une erreur, parce que ni jquery ni jquery mobile aura été chargé par le temps, l'extrait est analysé.

Donc je suis en train de faire, y compris à la fin de chaque page:

if (document.addEventListener) {
    document.addEventListener("jqmReady",function(){trigAnalytics("jqmReady");alert("FF detected")},false); 
} else if ( document.attachEvent ) {
    document.attachEvent("jqmReady", function(){trigAnalytics("jqmReady");alert("IE detected")}); 
}

Et quand il est détecté, je vais allumer ma analytics extrait avec le pageshow de liaison:

var trigAnalytics = function( trigger ){ 
    $(document).on('pageshow','div:jqmData(role="page").basePage', function (event, ui) {
        var url = location.href; 
        try { 
            hash = location.hash; 
            if (hash && hash.length > 1) {
                 _gaq.push(['_trackPageview', hash.substr(1)]);
                 _gaq.push(['_setCustomVar', 1, 'id_external', ########, 1 ]);
            } else {
                _gaq.push(['_trackPageview', url]);
                _gaq.push(['_setCustomVar', 1, 'id_external', ########, , 1 ]);
                _gaq.push(['b._trackPageview', url]);
            } 
        } catch(err) { } 
    }); 
    if (typeof _gaq !== "undefined" && _gaq !== null) { 
        $(document).ajaxSend(function(event, xhr, settings){ 
            _gaq.push(['_trackPageview', settings.url]); 
            _gaq.push(['b._trackPageview', settings.url]);
        }); 
    } 
};

Donc pour le coup de l'événement de la chaîne, j'ai besoin de déclencher jqmReady quand JQM est prêt. JQM utilise leur mobileinit événement pour indiquer cela. Donc, à l'intérieur de mon contrôleur d'application de l'init, je suis de liaison à elle de la sorte:

$(document).bind("mobileinit", function () {

    //non-IE OK
    if (document.createEvent) {
        evt = document.createEvent("Event");
        evt.initEvent("jqmReady", true, true);
        document.dispatchEvent(evt);

    } else if (document.createEventObject) { 
    //MSIE (NOT WORKING)

        document.documentElement.evt = 0; //an expando property
        document.documentElement.attachEvent("jqmReady", function () {
            document.documentElement.evt = document.documentElement.evt + 1;
            });
    }
});

J'ai essayé tout simplement de déclenchement $(window).trigger('jqmReady'), parce que quand mobileinit déclencheurs, jquery est disponible. Cependant, il semble événements créés dans addEventListener ne peut pas être déclenchée, comme cela, j'ai donc besoin d'un javascript seule solution pour déclencher un événement personnalisé dans IE.

Question:
Quelqu'un peut-il me donner un pointeur sur la façon de déclencher un script javascript événement personnalisé pour IE8 correctement?

source d'informationauteur frequent

  1. 11

    Ok, je comprends enfin... voici comment cela fonctionne:

    1) réglage de l'auditeur pour jqmReady sur la page en cours de chargement

    //non-IE: just create a listener for the custom event "jqmReady"
if (document.addEventListener) {
    document.addEventListener("jqmReady",function(){trigAnalytics("jqmReady");alert("FF detected")},false); 
//IE8
} else if ( document.attachEvent ) {

    //create a custom property name jqmReady and set it to 0
    document.documentElement.jqmReady = 0;
    //since IE8 does not allow to listen to custom events, 
    //just listen to onpropertychange
    document.documentElement.attachEvent("onpropertychange", function(event) {

        //if the property changed is the custom jqmReady property
        if (event.propertyName == "jqmReady") {
            trigAnalytics("jqmReady");
            alert("gotcha")
            //remove listener, since it's only used once
            document.documentElement.detachEvent("onpropertychange", arguments.callee);
        }
    });
}

    Donc sur IE8, je ne suis pas à l'écoute personnalisée jqmReady. Au lieu de cela j'écoute pour onpropertychange pour ma propriété personnalisée jqmReady

    2) Puis sur mobileinit je suis déclenchement comme ceci:

     //non-IE
 if (document.createEvent) {
      evt = document.createEvent("Event");
      evt.initEvent("jqmReady", true, true);
      document.dispatchEvent(evt);
 } else if (document.createEventObject) { //MSIE
      //just change the property 
      //this will trigger onpropertychange
      document.documentElement.jqmReady++;
 };

    Bonne idée (crédit à http://dean.edwards.name/weblog/2009/03/callbacks-vs-events/), peut-être quelqu'un d'autre peut trouver une utilisation pour elle.

  2. 6

    Pour toute autre personne intéressée, j'ai enveloppé ce code dans un statique objet javascript

    function Event () {
}

Event.listen = function (eventName, callback) {
    if(document.addEventListener) {
        document.addEventListener(eventName, callback, false);
    } else {    
        document.documentElement.attachEvent('onpropertychange', function (e) {
            if(e.propertyName  == eventName) {
                callback();
            }            
        });
    }
}

Event.trigger = function (eventName) {
    if(document.createEvent) {
        var event = document.createEvent('Event');
        event.initEvent(eventName, true, true);
        document.dispatchEvent(event);
    } else {
        document.documentElement[eventName]++;
    }
}

    utilisation:

    Event.listen('myevent', function () {
    alert('myevent triggered!');
});

Event.trigger('myevent');

    Démo:
    http://jsfiddle.net/c5CuF/