Get Input Textbox Value and Textarea Value in jQuery

Last Updated on August 4, 2022 by Roshan Parihar

In this tutorial, learn how to get input textbox value and textarea value on button click using jQuery. The short answer is to use the jQuery selector with val() function to get value.

You can use the click event of jQuery to find the values of input box and textarea. After you get the value, you can display it using the html() function of jQuery.

Let’s learn the methods with examples given below.

How to Get Input Textbox Value Using jQuery

You can get input value using jQuery val() function that required no argument to find the value. Firstly, you have to select the input box using a jQuery selector. After selecting the input box, you have to use the val() function to get the input box value as given below.

Test it Live

Output

Your Entered Content is:

The above example shows the input box with the button. You can enter any text in the textbox and click the button to get the input box value. After you click the button, you will get the entered text content prints out in the output using html() function.

How to Find Textarea Value Using jQuery

In addition to the above example, you can also get textarea value using the val() function of jQuery. The method is the same as given above and you have to use jQuery to select the element. After that, use the val() function to get the user entered content in the textarea.

Output




Your Entered Content is:

The above example contains the textarea and the button. You can enter a single or multiline line of content in the given textarea. After that, click the button to get the content in the output.

I hope you like this post on how to get the input textbox value and textarea value using jQuery.

You may also like to read