I'm trying to write a couple functions that will clear a form field on
focus. I also want to the change the class if the value has changed.
I'm new to jQuery and a novice Javascript developer, so hopefully my
issue is apparent. There appears to be an issue in how I am
referencing $this. I wanted these functions to be dynamic, as in they
will automatically affect all inputs on my form.
The functions appear to be attaching properly - onFoucs confirmed -
but if I console.log out $this.value it is undefined. if I do just
$this, then I can see the object and it shows input#txtfirstname for
example but I can't figure out how to properly reference $this.value
for instance.
ANy help would be greatly appreciated.
JAVASCRIPT EXCERPT:
$(document).ready(function() {
$("form :text").blur(function(){
var $this = $(this);
if( $this.value = '' ) {
$this.value = defaultValue;
$this.removeClass("changed").addClass
("default");
}
else
{
$this.removeClass("default").addClass("changed");
}
return false;
});
$("form :text").focus(function(){
var $this = $(this);
if( $this.value = $this.defaultValue ) {
$this.value = '';
$this.removeClass("default").addClass
("changed");
}
else
{
$this.removeClass("changed").addClass("default");
}
return false;
});
});
HTML EXCERPT:
<div class='formField'>
<span><input type='text' name='txtfirstname' title='Text input: First
Name' id='txtfirstname' size='20' value='First Name' /></span>
<span><label for='txtfirstname'>First Name:</label></span>
<span class='currentValue'>$keycontact->pNameF</span>
</div>
<div class='formField'>
<span><input type='text' name='txtlastname' title='Text input: Last
Name' id='txtlastname' size='20' value='Last Name' /></span>
<span><label for='txtlastname'>Last Name:</label></span>
<span class='currentValue'>$keycontact->pNameL</span>
</div>
