Eu tenho um script jquery que preciso executar apenas depois que tudo o mais na página, incluindo alguns outros javascripts (sobre os quais não tenho controle) terminaram de fazer seu trabalho.
Achei que talvez houvesse uma alternativa para $ (document). Já, mas não consegui encontrá-la.
Respostas:
Você pode ter $(document).ready()várias vezes em uma página. O código é executado na sequência em que aparece.
Você pode usar o $(window).load()evento para o seu código, pois isso acontece depois que a página está totalmente carregada e todo o código nos vários $(document).ready()manipuladores terminou de ser executado.
$(window).load(function(){
//your code here
});$(window).on('load', function() { });porque $ (window) .load () está obsoleto.
Este bloco de código resolve meu problema,
<script type="text/javascript">
$(window).bind("load", function () {
// Code here
});
</script>Vários $(document).ready()serão disparados em ordem de cima para baixo na página. O último $(document).ready()será disparado por último na página. Dentro do último $(document).ready(), você pode acionar um novo evento personalizado para disparar após todos os outros.
Envolva seu código em um manipulador de eventos para o novo evento personalizado.
<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>A partir daqui :
// 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
} Isso irá esperar até que o jQuery seja carregado para usá-lo, mas você pode usar o mesmo conceito, definindo variáveis em seus outros scripts (ou verificando-as se não forem o seu script) para esperar até que sejam carregadas para usá-las.
Por exemplo, em meu site, eu uso isso para carregamento de JS assíncrono e esperando até que eles terminem antes de fazer qualquer coisa com eles usando jQuery:
<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> Acontece que, devido a uma mistura peculiar de estruturas javascript, eu precisei iniciar o script usando um ouvinte de eventos fornecido por uma das outras estruturas.
Você tentou carregar todas as funções de inicialização usando o $().ready, executando a função jQuery que você queria por último?
Talvez você possa usar setTimeout()na $().readyfunção que deseja executar, chamando a funcionalidade que deseja carregar.
Ou use setInterval()e faça com que o intervalo verifique se todas as outras funções de carregamento foram concluídas (armazene o status em uma variável booleana). Quando as condições forem atendidas, você pode cancelar o intervalo e executar a função de carregamento.
$(window).load(function(){...})