Menu
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.
267
The onfocus property of an Input object specifies an event handler function that is invoked when the user transfers keyboard focus to that input element.
The onfocus attribute fires the moment that the element gets focus. Onfocus is most often used with <input>, <select>, and <a>. Tip: The onfocus attribute is the opposite of the onblur attribute.
onClick : This event is fired whenever the user clicks in an object, like a button, an image, an input... After the click, then comes the: onFocus : This event is fired when an element is selected, it doesn't need to be clicked, it can be done programmatically, calling . focus() or using the Tab key, for example.
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;
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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
