Impossible de lire la propriété 'substring' de undefined après avoir mis la ligne dans setTimeout

Question

J'ai vérifié très attentivement la console dans le navigateur.
Cette ligne:

document.getElementById("role_show_" + $(this).attr("id").substring(7, 9)).style.display = "block"; 

est exécuté normalement. Mais quand je l'ai mis dans un setTimeout comme celui-ci:

setTimeout(function() { 
    document.getElementById("role_show_" + $(this).attr("id").substring(7, 9)).style.display = "block"; 
}, 400); 

La console affiche cette erreur:
Uncaught TypeError: Cannot read property 'substring' of undefined

Ce qui se passe ici? Je suis sûr que toutes les autres lignes de code sont inédites.

Answer 1

fonction setTimeout fait votre $(this) être dans un cadre différent. Pour que cela fonctionne, enregistrez votre $(this) dans une variable avant d'appeler la fonction setTimeout.

var that = $(this); 
setTimeout(function() { 
    document.getElementById("role_show_" + $(this).attr("id").substring(7, 9)).style.display = "block"; 
}, 400); 

vous pouvez donc désormais accéder à votre $(this) en fonction setTimeout en utilisant that essentiellement.

Answer 2

C'est à cause du $(this). Lorsque vous êtes que vous voulez qu'il soit dans la fonction, vous accédez à la fonction elle-même, et la fonction ne dispose pas d'un id attribut