How to use the val() method In JQuery
jQuery val() method is used to get the value of an input text box. This function is used to set or return the value. Return value gives the value attribute of the first element. In the case of the set value, it sets the value of the attribute for all elements. This element is mostly used with HTML forms.
Syntax:
$('element_selector').val()
Example 1: This example is implemented where a text is written in the field and when the show value button is clicked a popover comes up and shows the entered text.
html
<!DOCTYPE html> <html lang="en"> <head> <script src= "https://code.jquery.com/jquery-3.4.1.min.js"> </script> <script> $(document).ready(function () { // On button click, get value // of input control $("#getValBtnID").click(function () { const inputString = $("#userInputID").val(); alert(inputString); }); }); </script> </head> <body style="text-align: center"> <h3 style="color:green"> w3wiki </h3> <b>JQuery val() Method</b> <br><br> <input type="text" id="userInputID"> <br><br> <button type="button" id="getValBtnID"> Get Value </button> </body> </html> |
Output:
How to get the value in an input text box using jQuery ?
In this article, we will learn about the different methods to access the value of the input text box entered by the user using jQuery. Below are the different approaches listed to get the value of an input text box using jQuery:
Table of Content
- Using the val() method
- Using the prop() method
Let us now discuss all the above-listed methods in detail with the help of code examples.
Contact Us