Ich stecke derzeit in einem JavaScript -Code-Stück fest, das in chrome (version 44.0.2403.125) funktioniert, aber in IE 10 NICHT .

Ich habe mehrere Probleme beim Stackoverflow mit (irgendwie) demselben Problem gelesen, aber alles, was dort vorgeschlagen wird, scheint für mich nicht zu funktionieren (oder ich implementiere es nicht richtig).

Jedenfalls stecke ich in folgenden Punkten fest: Ich habe eine Timer-Funktion in JavaScript, die einen Countdown von 10 Minuten bis 0 ausführt. Wenn 0 Minuten erreicht sind, wird eine jquery -Funktion ausgelöst, ein Popup-Feld.

Der Javascript-Code lautet wie folgt:

<SCRIPT LANGUAGE="JavaScript">
    function startTimer(duration, display) {
        var timer = duration, minutes, seconds;
        setInterval(function () {
            minutes = parseInt(timer / 60, 10)
            seconds = parseInt(timer % 60, 10);

            minutes = minutes < 10 ? "0" + minutes : minutes;
            seconds = seconds < 10 ? "0" + seconds : seconds;

            display.textContent = minutes + ":" + seconds;

            if (--timer < 0) {
                my_fun(); //the jquery function that popups the message-box 
                timer = duration;
            }
        }, 1000); //how fast to count
    }
    window.onload = function () {
        var tenMinutes = 60 * 10,
            display = document.querySelector('#time');
        startTimer(tenMinutes, display);
    };
</SCRIPT>

Die Jquery-Funktion ist ziemlich lang (hier einzufügen), aber dies scheint nicht das Problem zu sein. Ich habe die jquery-Funktion separat verwendet (ohne sie über JavaScript auszulösen) und dies funktioniert im IE - sie erscheint, wenn sie im HTML aufgerufen wird. Außerdem habe ich auf das jquery-1.11.2.min.js library verwiesen, das (soweit ich weiß) so ziemlich alle Probleme mit der Browser-Inkompatibilität überwindet.

Als nächstes habe ich nach dem IE10-Konsolenprotokoll gesucht. Dort bemerkte ich, dass es immer wieder den folgenden Fehler erzeugte:

SCRIPT5007: Unable to set property 'textContent' of undefined or null reference. 

Dies ließ mich glauben, dass die Eigenschaft textContent in IE10 nicht verfügbar ist, daher habe ich dies ebenfalls überprüft, obwohl ich nach Recherchen herausgefunden habe, dass diese Eigenschaft in IE10 zulässig ist (funktionieren sollte).

Das nächste, was mir einfiel, war, dass window.onload in IE10 nicht funktionierte. Ich las einige Vorschläge zur Verwendung von neu in onload in IE10 wie folgt: {{ X2}} aber das hatte auch keine Auswirkung.

Dann habe ich versucht, den window.onload JavaScript-Code über der Timer-Funktion einzufügen, damit der textContent möglicherweise nicht leer ist, aber dies hatte auch keine Auswirkung.

Jetzt habe ich keine Ideen mehr. Hat jemand eine Ahnung, wie ich das beheben kann?

UPDATE

Vielen Dank für die Antworten und Vorschläge! Nachdem ich alle Vorschläge ausprobiert hatte, dauerte es noch eine Weile, bis das Problem behoben war, aber ich habe es trotzdem behoben.

Zuerst habe ich versucht, das var display; als globales Element hinzuzufügen, aber dies hatte keine Auswirkungen. Als nächstes habe ich mir meine Codepage im Allgemeinen angesehen. Ich arbeite an einer klassischen Asp-Seite und mache viele serverseitige Sachen. Die Seitenansicht hängt von einigen Abfragen ab. Abgesehen davon hatte ich mein $time ID nach einigen asp-klassischen serverseitigen Handles, sodass ich dachte, dass das Verschieben der ID auf die Seite (vor dem serverseitigen Material) funktionieren könnte. Dies hatte jedoch keine Auswirkungen. Danach habe ich einige Dinge ausprobiert und ehrlich gesagt kann ich mich nicht an alles erinnern.

Dann sah ich #Arunachalam antworten und dachte, dass dies tatsächlich funktionieren könnte, da meine andere JQuery ihre Arbeit im IE erledigte, während JavaScript dies nicht tat. Also anstatt zu verwenden:

window.onload = function () {
            var tenMinutes = 60 * 10,
                display = document.querySelector('#time');
            startTimer(tenMinutes, display);
        };

Ich habe die JQuery-Version davon verwendet:

$(function() {

 var tenMinutes = 60 * 10,display = document.querySelector('#time');  
 startTimer(tenMinutes, display);

}

Aber leider hatte dies auch keine Auswirkung. 100 Versuche / Anpassungen später (und umkehren, da sie nicht funktionierten) Ich habe es mit Jquery erneut versucht, aber geändert, um:

jQuery(function ($) {
    var tenMinutes = 60 * 10,
        display = $('#time');
    startTimer(tenMinutes, display);
});

Und Kombinieren der Funktion JavaScript und der obigen Funktion Jquery in demselben SCRIPT-Tag durch Ändern von <SCRIPT LANGUAGE="JavaScript"> in <SCRIPT>

Und das hat den Trick gemacht! Habe es jetzt zum Laufen gebracht!

1
Nicolas 5 Aug. 2015 im 12:39

3 Antworten

Beste Antwort

Da Sie JQuery bereits verwenden, empfehle ich Ihnen, Ihre Funktion innerhalb von JQuery onload anstelle von Window onload aufzurufen.

$(function() {

 var tenMinutes = 60 * 10,display = document.querySelector('#time');  
 startTimer(tenMinutes, display);

}
3
Arunachalam 5 Aug. 2015 im 09:48

Fügen Sie var display; vor der Zeile function startTimer(duration, display) {... hinzu

Der Fehler bedeutet, dass die Variable display nicht in dem Bereich gefunden wird, in dem Sie sie verwendet haben. Wenn Sie es oben definieren, wird es zu einer globalen Variablen, auf die dann im Code zugegriffen werden kann.

Der vollständige Code sollte folgendermaßen aussehen:

<SCRIPT LANGUAGE="JavaScript">
    var display;
    function startTimer(duration, display) {
        var timer = duration, minutes, seconds;
        setInterval(function () {
            minutes = parseInt(timer / 60, 10)
            seconds = parseInt(timer % 60, 10);

            minutes = minutes < 10 ? "0" + minutes : minutes;
            seconds = seconds < 10 ? "0" + seconds : seconds;

            display.textContent = minutes + ":" + seconds;

            if (--timer < 0) {
                my_fun(); //the jquery function that popups the message-box 
                timer = duration;
            }
        }, 1000); //how fast to count
    }
    window.onload = function () {
        var tenMinutes = 60 * 10,
            display = document.querySelector('#time');
        startTimer(tenMinutes, display);
    };
</SCRIPT>
3
Ahs N 5 Aug. 2015 im 09:45

Der Timer funktioniert einwandfrei. display bezieht sich auf null im IE. Ihr Code ist gut. Ich denke, time ist im IE irgendwie nicht vorhanden.

0
Mouser 5 Aug. 2015 im 09:56