I have a textarea element, and I am trying to find the height of it. Right now, I am using document.getElementById('area').offsetHeight. This does give me the height, however, I am wondering if there is a way to dynamically update this if I enlarge the textarea. Right now, even if I pull on the corner and make the textarea taller, the javascript returns the same result. Is there a way to update the height when I pull the corner?
Asked
Active
Viewed 52 times
0
Matt
- 85
- 7
-
3Possible duplicate of [Resize event for textarea?](http://stackoverflow.com/questions/5570390/resize-event-for-textarea) – Wes Foster Jun 22 '16 at 15:18
-
@WesFoster I do not want to use jQuery – Matt Jun 22 '16 at 15:19
-
1The same logic would apply to pure JavaScript. Bind a mouse event to the textarea, then re-check its dimensions. – Wes Foster Jun 22 '16 at 15:20
-
@WesFoster Which event to bind? `textarea` doesn't fire native `resize` ... – Teemu Jun 22 '16 at 15:21
-
@Teemu `onmouseup` – Wes Foster Jun 22 '16 at 15:22
-
@WesFoster If OP doesn't care the event firing on every mouseup anywhere on the textarea, then that'll do the trick. – Teemu Jun 22 '16 at 15:25
-
@WesFoster is there a way to recheck the height and save that as a variable? – Matt Jun 22 '16 at 17:26
1 Answers
1
You can use the javascript onmouseup event. Using the console.log you can see that the value changes.
function mouseUp() {
console.log(document.getElementById('area').offsetHeight);
}<textarea id="area" onmouseup="mouseUp()"></textarea>
-
Is there a way to store the new height as a variable instead of logging it? – Matt Jun 22 '16 at 17:26
-
@Matt Its just javascript, you'd use it the same as you would anywhere else, i.e. var newHeight; newHeight = document.getElementById('area').offsetHeight; – K.Burrell Jun 23 '16 at 10:31