this.val() not working for textbox, but $('.selector').val() working

In my code, $("#date") is开发者_运维百科 a textfield with jquery datepicker attached. In the code below, when I select a date, firebug shows this error this.val is not a function

$("#date").change(function(){  
    var mydate = this.val();
    alert(mydate);
});

But when I change this.val() with $("#date").val(), it works perfectly and alerts the selected date. Can anyone point out why this.val() is not working?

EDIT

Sorry, $this was a typo. I actually used this.val(), not $this.val()

this in your event function isn't a jquery object, it's a dom object. Address it as $(this) and it should work for you.

$("#date").change(function(){  
    var mydate = $(this).val();
    alert(mydate);
});

You should write

$(this).val();

$this.val() should be $(this).val();

$("#date").change(function(){  
    var mydate = $(this).val();
    alert(mydate);
});

this is an actual DOM element, and val() is a jQuery method - you can't combine the two. Use $(this).val().

Try this

var mydate = $(this).val();