0

I want to make a program which adds a textbox every time you click a button. Here's my code:

window.onload = function () { linelist = document.getElementById("linelist"); }; function AddLine() { linelist.innerHTML += "<div class=\"normallink\"><input type=\"text\"><button class=\"dustbin\"><img src=\"dustbin.png\"></button></div><br />"; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <div id="linelist"></div><br /> <button id="addline" onclick="Addline();">+</button> </body> </html>

When I run it, it generates an error. Why is this occurring?

Improve this question
2
  • 3
    Your function name is AddLine but you used Addline onclick handler Commented Dec 3, 2020 at 12:22
  • 1
    Voting to close because the problem is caused by a typo. Commented Dec 4, 2020 at 14:41

1 Answer 1

Reset to default
1

You have to define linelist outside the functions first with let or var:

let linelist = null; window.onload = function () { linelist = document.getElementById("linelist"); }; function AddLine() { linelist.innerHTML += "<div class=\"normallink\"><input type=\"text\"><button class=\"dustbin\"><img src=\"dustbin.png\"></button></div><br />"; }
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

That's true only in strict mode, which this code isn't using. Here it creates an implicit global which is bad practice, but perfectly function and not the cause of the problem,

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.