HTML input onfocus & onblur?
Solution 1
You want this
<input ...
onfocus="if (this.value==this.defaultValue) this.value = ''"
onblur="if (this.value=='') this.value = this.defaultValue" />
Update: Some newer browsers will do what you want simply by adding the placeholder attribute:
<input placeholder="Please enter your name" />
Here is the PHP according to your code
echo <<<END
<label for="$name">$lable</label>
<input type="$type" name="$name" id="$name" value="$value"
onfocus="if (this.value==this.defaultValue) this.value = ''"
onblur="if (this.value=='') this.value = this.defaultValue"/>
END;
Solution 2
Looking at the source for this page shows the following
<form id="search" action="/search" method="get">
<div>
<input name="q" class="textbox" tabindex="1"
onfocus="if (this.value=='search') this.value = ''"
type="text" maxlength="80" size="28" value="search">
</div>
Solution 3
If I understand correctly, SO uses this line of HTML to do that effect.
<input name="q" class="textbox" tabindex="1" onfocus="if (this.value=='search') this.value = ''" type="text" maxlength="80" size="28" value="search">
Not related to your question, but you could and should replace your second if statement with an else statement.
function Input($name,$type,$lable,$value= null){
if (isset($value)) {
//if (this.value=='search') this.value = ''
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==\''.$value.'\') this.value = \'\' "/>';
}
else {
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" />';
}
}
Because if isset($value) returns false then you know for a fact that it isn't set since it can only return one of two values, true or false.
EDIT: Disregard this answer. It was not clear what the question was before the edit.
Solution 4
Or this if you want it to change back to default no matter what text is entered...
<input ...
onfocus="if (this.value==this.defaultValue) this.value = ''"
onblur="if (this.value!=this.defaultValue) this.value = this.defaultValue" />
![Adam Ramadhan](https://i.stack.imgur.com/4kK2Y.png?s=256&g=1)
Adam Ramadhan
be foolish, stay hungry. ⚡ Web Crawling & NER Related ⚡ Hosting & Infrastructure ⚡ Broadband ISP & Its Software
Updated on August 04, 2020Comments
-
Adam Ramadhan almost 4 years
ok, today I'm making a helper HTML function. It looks like this:
function Input($name,$type,$lable,$value= null){ if (isset($value)) { //if (this.value=='search') this.value = '' echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==\''.$value.'\') this.value = \'\' "/>'; } if (!isset($value)) { echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" />'; } }
As you can see, if you insert a value it will do some JavaScript so that when I click the box, the text inside the box will disappear,
Question: How can we make it to have a value when we are not on the input? (please look at the search box on stackoverflow, however the one that is on stackoverflow doesn't come back after we are not pointing at the input box? Maybe by using onblur? Am I right?
Hope you understand what I mean.
ok becouse some of you are not getting what i mean please see
when im not clicking it.
when im clicking it.
when im not clicking it again.
it should be
when im not clicking it.
when im clicking it.
when im not clicking it again.
-
Adam Ramadhan almost 14 yearsyes it should look like this one :), let me study it first :)
-
Adam Ramadhan almost 14 yearsstill have some problems.
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==this.defaultValue) this.value = \'\' onblur="if (this.value==\'\') this.value = this.defaultValue" />';
it will be like<input type="text" this.value="this.defaultValue"" (this.value="='')" if="" onfocus="if (this.value==this.defaultValue) this.value = '' onblur=" value="awdwadaw" id="name" name="name">
-
Adam Ramadhan almost 14 years
echo '<label for="'. $name .'">'. $lable .'</label><input type="'.$type.'" name="'. $name .'" id="'. $name .'" value="'.$value.'" onfocus="if (this.value==this.defaultValue) this.value = \'\'" onblur="if (this.value==\'\') this.value = this.defaultValue" />';
work! thanks -
Mike almost 14 yearsYou accepted an answer. Why are you still looking into it? This is the exact code that SO uses. It will behave exactly like you see on this site.
-
mplungjan about 12 yearsWhy on earth would you want to do that? Then you might as well make it readonly.
-
mickey about 11 yearsMaybe you'd rather want:
<input ... onfocus="if (this.value==this.defaultValue) this.value = ''" onblur="if (this.value!='') this.value = this.defaultValue" />
That way you get the text back if no text was entered wheninput
loses focus.