Ich habe ein JQuery-Skript, das ich nur ausführen muss, wenn alles andere auf der Seite, einschließlich einiger anderer Javascripts (über die ich keine Kontrolle habe), ihre Arbeit beendet hat.
Ich dachte, es gab vielleicht schon eine Alternative zu $ (Dokument), aber ich konnte sie nicht finden.
Antworten:
Sie können $(document).ready()mehrere Male auf einer Seite haben. Der Code wird in der Reihenfolge ausgeführt, in der er angezeigt wird.
Sie können das $(window).load()Ereignis für Ihren Code verwenden, da dies geschieht, nachdem die Seite vollständig geladen wurde und der gesamte Code in den verschiedenen $(document).ready()Handlern ausgeführt wurde.
$(window).load(function(){
//your code here
});
$(window).on('load', function() { });da $ (window) .load () veraltet ist.
Dieser Codeblock löst mein Problem,
<script type="text/javascript">
$(window).bind("load", function () {
// Code here
});
</script>Mehrere $(document).ready()werden in der Reihenfolge von oben nach unten auf der Seite ausgelöst. Der letzte $(document).ready()wird zuletzt auf der Seite ausgelöst. Im letzten $(document).ready()können Sie ein neues benutzerdefiniertes Ereignis auslösen, das nach allen anderen ausgelöst wird.
Wickeln Sie Ihren Code in einen Ereignishandler für das neue benutzerdefinierte Ereignis.
<html>
<head>
<script>
$(document).on("my-event-afterLastDocumentReady", function () {
// Fires LAST
});
$(document).ready(function() {
// Fires FIRST
});
$(document).ready(function() {
// Fires SECOND
});
$(document).ready(function() {
// Fires THIRD
});
</script>
<body>
... other code, scripts, etc....
</body>
</html>
<script>
$(document).ready(function() {
// Fires FOURTH
// This event will fire after all the other $(document).ready() functions have completed.
// Usefull when your script is at the top of the page, but you need it run last
$(document).trigger("my-event-afterLastDocumentReady");
});
</script>Von hier aus :
// Add jQuery
var GM_JQ = document.createElement('script');
GM_JQ.src = 'http://jquery.com/src/jquery-latest.js';
GM_JQ.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(GM_JQ);
// Check if jQuery's loaded
function GM_wait()
{
if(typeof unsafeWindow.jQuery == 'undefined')
{
window.setTimeout(GM_wait,100);
}
else
{
$ = unsafeWindow.jQuery;
letsJQuery();
}
}
GM_wait();
// All your GM code must be inside this function
function letsJQuery()
{
// Do your jQuery stuff in here
} Dies wartet, bis jQuery geladen ist, um es zu verwenden. Sie können jedoch dasselbe Konzept verwenden, indem Sie Variablen in Ihren anderen Skripten festlegen (oder sie überprüfen, wenn sie nicht Ihr Skript sind), um zu warten, bis sie geladen werden, um sie zu verwenden.
Auf meiner Site verwende ich dies beispielsweise zum asynchronen Laden von JS und zum Warten, bis sie fertig sind, bevor ich mit jQuery etwas mit ihnen mache:
<script type="text/javascript" language="JavaScript">
function js(url){
s = document.createElement("script");
s.type = "text/javascript";
s.src = url;
document.getElementsByTagName("head")[0].appendChild(s);
}
js("/js/jquery-ui.js");
js("/js/jrails.js");
js("/js/jquery.jgrowl-min.js");
js("/js/jquery.scrollTo-min.js");
js("/js/jquery.corner-min.js");
js("/js/jquery.cookie-min.js");
js("/js/application-min.js");
function JS_wait() {
if (typeof $.cookie == 'undefined' || // set in jquery.cookie-min.js
typeof getLastViewedAnchor == 'undefined' || // set in application-min.js
typeof getLastViewedArchive == 'undefined' || // set in application-min.js
typeof getAntiSpamValue == 'undefined') // set in application-min.js
{
window.setTimeout(JS_wait, 100);
}
else
{
JS_ready();
}
}
function JS_ready() {
// snipped
};
$(document).ready(JS_wait);
</script> Es stellt sich heraus, dass ich aufgrund einer besonderen Mischung von Javascript-Frameworks das Skript mithilfe eines Ereignis-Listeners initiieren musste, der von einem der anderen Frameworks bereitgestellt wird.
Haben Sie versucht, alle Initialisierungsfunktionen mit der zuletzt $().readyausgeführten jQuery-Funktion zu laden ?
Vielleicht können Sie setTimeout()die $().readyFunktion verwenden, die Sie ausführen möchten, und die Funktionalität aufrufen, die Sie laden möchten.
Oder verwenden Sie setInterval()die Intervallprüfung, um festzustellen, ob alle anderen Ladefunktionen abgeschlossen sind (speichern Sie den Status in einer booleschen Variablen). Wenn die Bedingungen erfüllt sind, können Sie das Intervall abbrechen und die Ladefunktion ausführen.
$(window).load(function(){...})