Någon som kan förklara mig varför min Event Object "fungerade" inte hos mig? (Javascript)
Jag har en javascript code med enkel event object
function checkLength(e, minLength){
var el, elMsg;
if(!e){
e=window.event;
}
el = e.target || e.srcElement;
elMsg = el.nextSibling;
if(el.value.length<minLength){
elMsg.innerHTML = 'Username must be' + minLength + 'characters or more';
} else{
elMsg.innerHTML = ' ';
}
}
var elUsername = document.getElementById('username');
if(elUsername.addEventListener){
elUsername.addEventListener('blur', function(e){
checkLength(e,5);
}, false);
} else{
elUsername.attachEvent('onblur', function(e){
checkLength(e,5);
});
}
Och jag hade en html fil:
<!DOCTYPE html>
<html>
<head>
<title>JavaScript & jQuery - Chapter 6: Events - Event Listener and Event Object</title>
<link rel="stylesheet" href="CSS/c06.css" />
</head>
<body>
<div id="page">
<h1>List King</h1>
<h2>New Account</h2>
<form method="post" action="http://www.example.org/register">
<label for="username">Create a username: </label>
<input type="text" id="username" />
<div id="feedback"></div>
<label for="password">Create a password: </label>
<input type="password" id="password" />
<div id="feedback"></div>
<input type="submit" value="sign up" />
</form>
</div>
<script src="js/event-listener-with-object.js"></script>
</body>
</html>
och javascript fungerade inte. Jag menar chrome kunde läsa js filen men ingen vårningtext var synligt.(Vårningtext måste visas om användaren har skrivit in namnet kortare än 5 bokstäver)
Men!
Efter jag har bytt HTML linjen
<input type="text" id="username" />
<div id="feedback"></div>
till
<input type="text" id="username" /> <div id="feedback"></div>
och problemet löstes. Någon som kan förklara mig varför?