JQuery/JavaScript: SetInterval Verifique se o elemento DOM existe?

Question

var verificação; function showLoader () {$ ('#mc_signup_form'). precend ('carregando…'); check_init (); }

    function check_init() {
        check = setInterval('check_trigger()', 300);
    }

    function check_clear() {
        clearInterval(check);
    }

    function check_trigger() {
        if ( $('.mc_error_msg').length == 0 || $('.mc_success_msg').length == 0 ) {
            $('#mc_signup_form .loading').remove();
            check_clear();
        }
    }

Eu me pergunto por que meu navegador continua me dizendo que check_trigger () não existe? Estou iniciando um setInterval dentro da minha função ShowLoader (). Deve acionar check_trigger. Quando um dos dois divs (.mc_error_msg ou .mc_success_msg) existe, quero limpar o intervalo.

O que estou fazendo errado?

Answer 1

Eu acho que passando cordas para setTimeout e setInterval apenas leva a problemas :)

Tentar:

setInterval(check_trigger, 300);

Answer 2

Deve ser check_trigger apenas remover fora da citação única ou dupla ...

Answer 3

Use também o setTimeout em vez do setInterval para que você possa se livrar da variável global

Answer 4

Evite avaliação dupla

Colocando essa função em quotes, ECMA-/JavaScript irá eval Esse código, que é inacreditável lento. Então sempre use um function reference com setTimeout / setInterval:

setInterval(function(){
    check_trigger();
}, 300);

ou diretamente

setInterval(check_trigger, 300);

Se você remover os elementos em questão por si mesmo em algum lugar, pode ser uma abordagem interessante para gancho a jQuery .remove() ou .detach() Método (se você ligar para remover o elemento).

Isso poderia parecer:

var hookRemove = $.fn.remove;

$.fn.remove    = function(){
    if(this.id === 'something'){
       // hoorray! we found it
    }

    hookRemove.apply(this, arguments);
};

Lembre -se de que você está lidando com um jQuery object dentro do gancho. Então, na verdade this também poderia ser um wrapped set de elementos. Portanto, uma chamada para

this.each(function(){
});

Dentro do gancho deve ser mais salvo para verificar. Assim você tem um exact conhecimento de quando um objeto é removido sem um intervall timer.

Answer 5

Combinar as várias sugestões aqui é a versão simplificada que deve funcionar, independentemente do escopo em que é definido.

function showLoader () {
    $('#mc_signup_form').prepend('<span class="loading"> loading &hellip;</span>');
    setTimeout (function check_trigger () {
      if ( $('.mc_error_msg').length == 0 || $('.mc_success_msg').length == 0 ) {
        $('#mc_signup_form .loading').remove();
      } else {
        setTimeout (check_trigger, 300);
      }   
    }, 300); 
}