HTML code to make text disappear

Keyser Soze Corporal

i want to make it so in a text box when u click on it with the mouse (set ur curser there) the text disappears

i am trying to make a small template edit for this mod here http://www.vbulletin.org/forum/showthread.php?t=165564

what this mod does is, it sticks the text <no subject> into a text box, well what i want is when i click on that text box the <no subject> disappears

Keyser Soze, Oct 12, 2008

#1

Use the javascript OnFocus event to find when a user clicks in the input box. (and if you want to put it back to <no subject> when a user clicks out with no input use OnBlur)

The example below checks the value of the input box when clicked. If it contains "<no subject>" it clears it (but doesn't if it contains anything else)
Then when a user leaves the textbox, if it is left blank it puts "<no subject>" back in

Code:

<html>
	<head>
		<title>Test</title>
	</head>

	<body>
		<script type="text/javascript">
			function ClearInput(x)
			{
				// Only Clear box if it has <no subject>
				inputstring = document.getElementById(x).value;
				if (inputstring=='<no subject>')
				{
					document.getElementById(x).value='';
				}
			}

			function ValidateInput(x)
			{
				// If the box is empty put back <no subject>
				inputstring = document.getElementById(x).value;
				if (inputstring=='')
				{
					document.getElementById(x).value='<no subject>';
				}
			}

		</script>

		<input id="input1" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input2" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input3" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input4" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>

	</body>
</html>

matt.chugg, Oct 13, 2008

#2

Keyser Soze Corporal

ok thanks ill give it a try

Keyser Soze, Oct 15, 2008

#3

mooapo Private E-2

matt.chugg said: ↑
Use the javascript OnFocus event to find when a user clicks in the input box. (and if you want to put it back to <no subject> when a user clicks out with no input use OnBlur)

The example below checks the value of the input box when clicked. If it contains "<no subject>" it clears it (but doesn't if it contains anything else)
Then when a user leaves the textbox, if it is left blank it puts "<no subject>" back in
Code:
<html>
	<head>
		<title>Test</title>
	</head>

	<body>
		<script type="text/javascript">
			function ClearInput(x)
			{
				// Only Clear box if it has <no subject>
				inputstring = document.getElementById(x).value;
				if (inputstring=='<no subject>')
				{
					document.getElementById(x).value='';
				}
			}

			function ValidateInput(x)
			{
				// If the box is empty put back <no subject>
				inputstring = document.getElementById(x).value;
				if (inputstring=='')
				{
					document.getElementById(x).value='<no subject>';
				}
			}

		</script>

		<input id="input1" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input2" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input3" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>
		<br>
		<input id="input4" type="text" style="width:200px;" value="<no subject>" onfocus="ClearInput(this.id)" onblur="ValidateInput(this.id)"/>

	</body>
</html>
Click to expand...
Hi, how are you doing? I tried to use the script, I can't get it to work. Can you help me out? Thank you....

mooapo, Sep 30, 2011

#4

LauraR MajorGeeks Super-Duper Administrator Staff Member

mooapo said: ↑

Hi, how are you doing? I tried to use the script, I can't get it to work. Can you help me out? Thank you....
Click to expand...

Hi and welcome. This is an old thread and matt.chugg has not been signed on her for 3 years. I'm going to leave it though in case someone else may be able to help you.

LauraR, Sep 30, 2011

#5

pari22 Corporal

I think you can do this with simple "onClick" method.. Like this--

<html><head><title>(Type a title for your page here)</title>
<script type="text/javascript">
function make_blank()
{
document.form1.type.value ="";
}
</script>
</head>
<body >

<form name=form1 method=post action='test.php'>
<b>Type</b><input type=text name=type value='no subject' onclick="make_blank();">Enter subject
<input type=submit value=Submit> </form>

</body>
</html>

pari22, Oct 8, 2011

#6

Log in or Sign up

HTML code to make text disappear

Keyser Soze Corporal

matt.chugg MajorGeek

Keyser Soze Corporal

mooapo Private E-2

LauraR MajorGeeks Super-Duper Administrator Staff Member

pari22 Corporal