Javascript not working for: onclick show hidden div from textarea

Question

I am trying to allow a user to click in a textarea and when they start typing it shows an initially hidden div. Here is my script and html, but this does not work, not sure where I am going wrong.

    <head>
<script type="text/javascript">
document.getElementById("showPanel").onclick = function() {
    document.getElementById("thePanel").style.visibility = "visible";
}
</script>

</head>
<body>
<textarea name="showPanel" rows="2" cols="35" style="position:absolute; left:0px; top:0px; width:300px; height:50px;"></textarea>
<div id="thePanel" style="position:absolute;left:0px;top:100px;width:300px;height:200px;background: red; visibility:hidden;">
</div>
</body>

</html>

Answer 1

Just some minor changes based on what the guys have commented on above.

Added an id to the textarea

Moved JS script so that the the elements exist before you call the JS.

 <html> <head> </head> <body> <textarea name="showPanel" id="showPanel" rows="2" cols="35" style="position:absolute; left:0px; top:0px; width:300px; height:50px;"></textarea> <div id="thePanel" style="position:absolute;left:0px;top:100px;width:300px;height:200px;background: red; visibility:hidden;"> </div> <script type="text/javascript"> document.getElementById("showPanel").onclick = function() { document.getElementById("thePanel").style.visibility = "visible"; } </script> </body> </html>

Javascript not working for: onclick show hidden div from textarea

Question

1 answers

solution1
1 ACCPTED 2014-06-01 00:37:30

Javascript not working for: onclick show hidden div from textarea

Question

1 answers

solution1 1 ACCPTED 2014-06-01 00:37:30

solution1
1 ACCPTED 2014-06-01 00:37:30