Uncaught TypeError: Kann die Eigenschaft 'addEventListener' von null nicht lesen bei window.onload

Ich befolge dieses Tutorial https://www.youtube.com/watch?v=b4GwvdhrEQg&t=537s und um 5:13 sein Prototyp funktioniert, aber meins nicht. Ich erhalte den Fehler im Titel dieses Beitrags erklärteUncaught TypeError: Kann die Eigenschaft 'addEventListener' von null nicht lesen bei window.onload

Uncaught TypeError: Cannot read property 'addEventListener' of null at window.onload (rico-beweeg-oog.html:29) window.onload @ rico-beweeg-oog.html:29

ich kein Code Problem oder Lösung finden kann, habe ich das Skript überall in dem Code platziert, vor und nach den div-Elementen, aber es gerade gewonnen‘ t arbeiten.

Der Code:

<!DOCTYPE HTML> 

<html> 
<head> 

<style> 
#rico { 
    width: 1280px; 
    height: 1060px; 
    overflow: hidden; 
    background-color: #efefef; 
    cursor: pointer; 

} 

#ricobox { 
    width: 75px; 
    height: 75px; 
    background-color: rgb(0,255,0); 
    border-radius: 50%; 
    border: 15px rgb(255,0,0) solid; 
    transform: translate3d(50px, 50px, 0); 
} 
</style> 

<script> 
window.onload = function() { 
var rico = document.getElementById('#ricobox'); 
var container = document.getElementById('#rico').addEventListener("click", klikPositie, false); 

alert(); 

function klikPositie(e) { 
    var xPosition = e.clientX; 
    var yPosition = e.clientY; 

    var translate3dValue = "translate3d(" + xPosition + "px," + yPosition + "px, o)"; 
    rico.style.transform = translate3dValue; 
} 
} 
</script> 

</head> 

<body> 

    <div id="rico"> 
     <div id="ricobox"></div> 
    </div> 

</body> 

</html>

Quelle

2017-02-16 W.Romijn

benutze '' 'document.getElementById ('rico')' '' und document.getElementById ('ricobox') ohne das Nummernzeichen – trebor

Sie erhalten den Fehler, da Ihre ids tatsächlich sind ricobox und rico ohne das Pfund Charakter.

var rico = document.getElementById('ricobox'); 
var container = document.getElementById('rico').addEventListener("click", klikPositie, false);

sollte also funktionieren.

Sie müssen das Zeichen # verwenden, wenn Sie jQuery verwenden zum Beispiel $("#rico")fiddle

Quelle

2017-02-16 09:25:08 trebor

Danke, der Fehler des Nullobjekts ist weg! Aber wenn ich in das Rico-Div klicke, bewegt sich das Ricobox-Div nicht wie im Tutorial. Bin ich etwas fehlt, ich bin nur neu zu lernen, Javascript –

@ W.Romijn Sie haben einen Tippfehler 'var translate3dValue =" translate3d ("+ xPosition +" px, "+ yPosition +" px, 0) ";' Sie haben geschrieben ** o ** statt ** 0 ** – trebor

Ich hätte es nie bemerkt! Vielen Dank, Mann, es ist gelöst! –

<script> 
window.onload = function() { 
var rico = document.getElementById('ricobox'); 
var container = document.getElementById('rico').addEventListener("click", klikPositie, false); 

alert(); 

function klikPositie(e) { 
    var xPosition = e.clientX; 
    var yPosition = e.clientY; 

    var translate3dValue = "translate3d(" + xPosition + "px," + yPosition + "px, 0px)"; 
    rico.style.transform = translate3dValue; 
} 
} 
</script>

die gleiche wie document.getElementById('rico')

Arbeiten würde dort ist Fehler auf get-Element-ID und Ihr translate3d

Quelle

2017-02-16 09:34:24 wijaya

Uncaught TypeError: Kann die Eigenschaft 'addEventListener' von null nicht lesen bei window.onload

Antwort

Verwandte Themen