jQuery text() returns null in Google Chrome

Question

Hello

I'm studying a strange behavior in Google Chrome when using jQuery text function:

$(document).ready(function () {
   $("#btnSubmit").click(function () {
       var t = $('#txtMessage').text();
       alert(t); //this shows nothing in Google Chrome, but works in IE9
   });
});

when I change var t = $('#txtMessage').text(); to var t = $('#txtMessage').val(); it works in Chrome.

So, what's wrong with text() function?

PS: txtMessage is a textarea

Answer 1

The .val() function should be used to get the value of form elements like input, select, textarea, ...

Answer 2

• .text() gets the inner text of an element, so when getting the value it's just not an appropriate usage.
• .val() gets the value property of an input type element, and should be what you use to retrieve/set the value (this includes <textarea> elements, even though the value is between the tags).

The question isn't really "why doesn't .text() work in Chrome?", it's "why does .text() in IE?". Stick with .val() for inputs.