Simple Image Hiding - "Uncaught TypeError: Impossible de définir la propriété 'display' de"

Cela semble vraiment stupide, mais j'ai lu des dizaines de messages du forum similaires et je ne peux pas comprendre ce que je fais mal .Simple Image Hiding - "Uncaught TypeError: Impossible de définir la propriété 'display' de"

Je suis en train de concevoir un site web avec un bouton de menu dont l'icône devient un "X" quand il est ouvert. Il bascule à chaque clic. La fonction javascript s'exécute mais renvoie "Uncaught TypeError: Impossible de définir la propriété 'display' de unsdefined" quand elle atteint la ligne en changeant le style.display du bouton de menu sur "none".

Toutes les idées seraient très appréciées.

HTML:

<img id="menuIconImage" class="menuIcon" src="resources/menu.png" onclick="menuToggle()"> 
<img id="menuIconImageClose" class="menuIcon" src="resources/close.png" onclick="menuToggle()">

CSS:

.menuIcon { 

    position: fixed; 
    left: 33px; 
    top: 178px; 
    width: 35px; 
    height: 35px; 
    cursor: pointer; 
} 

#menuIconImageClose { 

    //the "close" image/button is hidden by default. 
    display: none; 
}

Javascript:

var menuState = 0; 

function menuToggle() { 
    "use strict"; 

    if (menuState === 0) { 

     document.getElementById("menuIconImage").stlye.display = "none"; 
     document.getElementById("menuIconImageClose").style.display = "block"; 
     menuState = 1; 

    } else if (menuState === 1) { 

     document.getElementById("menuIconImageClose").style.display = "none"; 
     document.getElementById("menuIconImage").style.display = "block"; 
     menuState = 0;  
    } 
}

Source

2017-09-22 Drake Withers

où 'menuState' est-il défini? –

Il est défini en haut du script. Je viens d'ajouter la définition de votre avis. –

vous venez de supprimer 2 lignes de code dans chacune des instructions if, assurez-vous qu'elles ne donnent pas d'erreur car je ne vois pas les éléments auxquels elles se réfèrent dans votre code. –

Il y a un mot mal orthographié 'stlye' qui devrait être 'style' à cette ligne:

document.getElementById("menuIconImage").stlye.display = "none";

devrait être

document.getElementById("menuIconImage").style.display = "none";

Mon analyse afin de déterminer la question a commencé avec le texte de l'erreur qui a indiqué que la question n'a pas été de trouver l'élément (à savoir la pièce document.getElementById("menuIconImage") a travaillé). Si l'élément n'a pas été trouvé, nous aurions une erreur avec le texte Uncaught TypeError: Cannot read property 'style' of null. Cela s'est réduit là où le problème était.

Source

2017-09-22 14:28:09 mrogers

J'apprécie l'explication supplémentaire. –

Simple Image Hiding - "Uncaught TypeError: Impossible de définir la propriété 'display' de"

Répondre

Questions connexes