im using a simple text input form. and the "value" is a default.. such as saying "title" in the title text feild to let users know this is where you enter your title. How can i make this default text disappear when a user clicks in text box to make an entry w/o having to backspace the text out? I see this effect all over the net. any ideas?

Recommended Answers

<script type="text/javascript">
function setValue(field)
{
	if(''!=field.defaultValue)
	{
		if(field.value==field.defaultValue)
		{
			field.value='';
		}
		else if(''==field.value)
		{
			field.value=field.defaultValue;
		}
	}
}
</script>
<input type="text" value="Enter Title" onfocus="setValue(this)" onblur="setValue(this)"/>
Jump to Post

for textarea, try innerHTML instead of value. You may have to work with the function a bit to get what you need, but the idea is to change the innerHTML content of the text area as it does not use the value field.

Jump to Post

All 6 Replies

<script type="text/javascript">
function setValue(field)
{
	if(''!=field.defaultValue)
	{
		if(field.value==field.defaultValue)
		{
			field.value='';
		}
		else if(''==field.value)
		{
			field.value=field.defaultValue;
		}
	}
}
</script>
<input type="text" value="Enter Title" onfocus="setValue(this)" onblur="setValue(this)"/>

that worked great, thank you very much.. However, I also have a "textarea", and it doesn't work for that. any ideas? Thanks so much for your help

for textarea, try innerHTML instead of value. You may have to work with the function a bit to get what you need, but the idea is to change the innerHTML content of the text area as it does not use the value field.

I tried with a textarea and it worked fine for me:

<script type="text/javascript">
function setValue(field)
{
	if(''!=field.defaultValue)
	{
		if(field.value==field.defaultValue)
		{
			field.value='';
		}
		else if(''==field.value)
		{
			field.value=field.defaultValue;
		}
	}
}
</script>
<input type="text" value="Enter Title" onfocus="setValue(this)" onblur="setValue(this)"/>
<textarea  onfocus="setValue(this)" onblur="setValue(this)">hi</textarea>

Not sure if you have some other event handler attached to your textarea.

in you function call you used "this" as feild. I thought at first i should replace that with the text i wanted to appear. but it doesn't work unless i too use "this".. very odd. what is "this"?? haha sorry if this is a dumb Q but I am a total noob here. I know basic php and just starting into js.

Thank you works perfectly! :)
and no other handlers on my form

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.19 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.