...

View Full Version : New guy needs basic help



RayHanz14
05-16-2012, 10:07 PM
First post on the forum... I'm brand new to Javascript and I'm teaching myself using the Headfirst HTML5 book. One of the exercises early in the book is asking me to create a musical playlist where I can add songs that will show up on the screen and also be added to the DOM. However, I'm not able to get it to work or see where my error lies. Any feed back would be great.

Here's my code:


<!doctype html>

<html lang="en">

<head>

<title>Webville Tunes</title>
<meta charset = "utf-8">
<script>

function init() {
var button = document.getElementById("addButton");
button.onclick = handleButtonClick;
window.onload = init;
}
function handleButtonClick() {
var textInput = document.getElementById("songTextInput");
var songName = textInput.value;
var li = document.createElement("li");
li.innerHTML= songName;
var ul = document.getElementById("playlist");
ul.appendChild(li);

alert ("Button was clicked!");
}

</script>

<link rel = "stylesheet" href="playlist.css">

</head>

<body>

<form>
<input type="text" id="songTextInput" size="40" placeholder="Song name">
<input type="button" id="addButton" value="Add Song">
</form>

<ul id="playlist">

</ul>

</body>

</html>

Old Pedant
05-16-2012, 10:19 PM
Ready to kick yourself?

Where do you ever call the init function that is needed to assign the onclick function to the button?

Just add something like

window.onload = init;

just befroe the </script> tag.

(Later, you can learn how to add multiple functions to window.onload, but this is enough to get started.)

RayHanz14
05-16-2012, 10:27 PM
Ready to kick yourself?

Where do you ever call the init function that is needed to assign the onclick function to the button?

Just add something like

window.onload = init;

just befroe the </script> tag.

(Later, you can learn how to add multiple functions to window.onload, but this is enough to get started.)

Thanks... I really appreciate it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum