How to get textbox value with jQuery
Published: May 11, 2010 , Updated: May 24, 2010 , Author: mkyong
To get the textbox value, you can use the jQuery val() function.
For example,
- $(‘input:textbox’).val() – Get textbox value.
- $(‘input:textbox’).val(“new text message”) – Set the textbox value.
Textbox example
<html> <head> <title>jQuery get textbox value example</title> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> </head> <body> <h1>jQuery get textbox value example</h1> <h4>TextBox value : <label id="msg"></label></h4> <div style="padding:16px;"> TextBox : <input type="textbox" value="Type something"></input> </div> <button id="Get">Get TextBox Value</button> <button id="Set">Set To "ABC"</button> <button id="Reset">Reset It</button> <script type="text/javascript"> $("button:#Get").click(function () { $('#msg').html($('input:textbox').val()); }); $("button:#Reset").click(function () { $('#msg').html(""); $('input:textbox').val(""); }); $("button:#Set").click(function () { $('input:textbox').val("ABC"); $('#msg').html($('input:textbox').val()); }); </script> </body> </html>
Note : You can find more similar articles at - jQuery Tutorials







I have one problem,actually when i click on submit button and show the textbox value to any label,it is appear and automatically disapper.. please tell me why this thing is happening.?
I have a question – This was a great example for the input textbox to read the value in it – but what if I want to combine that with an if/else statement – so that when the correct value is put in the textbox it would run the conditional statement and if the wrong information was entered it, it would display the else information. I am trying to create a JQuery based testing environment through students having to enter in the correct answer to the textbox and receiving immediate feedback. I would appreciate any help you might send my way.
I understood the example – to “get” the value to display somewhere . . . but I was trying to figure out how to take that concept and incorporate it with a conditional statement, if else – so I could create a true multiple choice scenario with their being a “correct” answer the “if” and then “else” options and depending on what they put in the textbox, it would trigger the appropriate response using a conditional statement. Does anyone know how to do that?
Thank you :)
Hey Mkyong,
Great tutorial!
I have a question.
Is there away to do what you did but have the output be a link?
for example:
if you enter the word “test”
I would like the out put to be
http://mysite/test.pdf
(Actually I got this far, I can make this happen
my problem now is getting it to be a live link)
How do I make it so the output not only displays my URL
but it is a live link as well?
Please let me know if this can be done,
your help will be greatly appreciated!
Thanks!
Thank You SOOO Much!
Wow, so easy…and almost what I need. Many thanks!
May be you could help me…
I am working on on-line calculator. The result of Calcullate button from step1 should be send to step2 (another html page) and used in further calculation. Is it doable?
just pass as query parameter
[...] Web Site Demo Share and Enjoy: [...]