alert text field value when someone enters

Question

I have a text field say

<input id="hello" type="text" name="suraj" />

When someone enters a value in this field, Is there a way to alert that value (without any button click) in javascript or jquery.

Please help. Thanks

Answer 1

On keypress you will get multiple alerts. If you handle on focusout then you can see the typed value. Use this code if you can handle on focusout.

$('#hell').on('focusout', function(){
  alert(event.target.value);
})

Answer 2

You can use .keyup() event as shown below :-

$('#hell').on('keyup',function(){
   alert($(this).val());
});

Fiddle

Or(if you want to alert text as soon as user finished typing then use .blur() event as shown)

$('#hell').on('blur',function(){
  alert($(this).val());   
});

Fiddle

Or you can also use .focusout() event as shown

$('#hell').on('focusout',function(){
    alert($(this).val()); 
});

Fiddle

Answer 3

here are some following event for keyboard

http://api.jquery.com/keypress/

http://api.jquery.com/keydown/

http://api.jquery.com/keyup/

and try

$('#hell').on('keyup',function() {
       alert($(this).val());
    });

or

$('#hell').on('keydown',function() {
       alert($(this).val());
    });

or

$('#hell').on('keypress',function() {
   alert($(this).val());
});

Answer 4

Just use focusout event, this way..

$('#hell').on('focusout',function(){
   alert($(this).val());
});

Or you can use blur

$('#hell').on('blur',function(){
  alert($(this).val())      
});

Answer 5

You can use keyup event like below

$('#hell').on('keyup',function()
{
   alert($(this).val());
});

Answer 6

Please Try this.

 <input id="hell" type="text" name="suraj" onChange="toggle()"/>

    <script language="JavaScript">
        function toggle() {
       var value = document.getElementById('hell').value;
       alert(value);
        }
    </script>