skip to Main Content
var textarea = document.getElementById("id");
var text = textarea.innerHTML;

My problem is that "text" always remains the value the textarea started out with. Not what was typed in.

Page loads with "sample text"
Change text to "other"
Call the above code
Value of the var text is "sample text"

Research suggests that entering text, changes some other type of object. But how do I access that one?

The only thing resembling a workaround, at best, so far. Seems to be recording inputs with on change events. But that seems to be absurdly over complicated. When I just need one single snapshot once, on explicit request.

2

Answers


  1. Use rather value:

    var textarea = document.getElementById("id");
    var text = textarea.value;
    
    function showValue(){
      var textarea = document.getElementById("id");
      alert(textarea.value);
    }
    <textarea id="id">sample text</textarea><br/>
    <button onclick="showValue()">Show value</button>
    Login or Signup to reply.
  2. Instead of innerHTML you need to use the value. Here’s a snippet where on input event we display the newest value at the top of a div that acts as a change log for the purpose of the test:

    function display(context) {
        document.getElementById("output").innerHTML = `<p>${context.value}</p>` + document.getElementById("output").innerHTML;
    }
    <textarea id="id" oninput="display(this);">abcd</textarea>
    <div id="output"></div>
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search