JavaScript 中的文本区域不能使用.value

Question

I'm trying to get the value of a text area after the submit button is pressed. However, when I try to use .value in my JS file to get the textarea, it doesn't work. Here is my code for my HTML text area and button:

<form>
        <textarea type="text" id = "textArea" rows="5" cols="100"></textarea>
        <br>
        <input type="button" id="submitButton" value="Submit">
</form>

And then this is my Javascript code for trying to get the value of the text area. I've set up a listener on the submit button.

var submit = document.getElementById("submitButton")
function buttonPressed(){
     var text = document.getElementById("textArea").value (this .value part doesn't show up)
     console.log(text);   
     submit.addEventListener("click", buttonPressed())
}

The .value part won't work and doesn't show up when I type it. The only thing that does show up is .nodeValue How would I get the value of this text area?

I'm a newb at Javascript so any help would be appreciated. Thank you.

Answer 1

your problem is that your button doesn't have attached the event listener because the "addEventListener is inside the function (that is never invoked), I extracted this and the function is invoked now.

 const submit = document.getElementById("submitButton"); submit.addEventListener("click", buttonPressed) function buttonPressed(){ const text = document.getElementById("textArea").value console.log(text); }

 <form> <textarea type="text" id = "textArea" rows="5" cols="100"></textarea> <br> <input type="button" id="submitButton" value="Submit"> </form>