on Field Test How to clear value onclick?

[fscaint]

Hello,
i Have problem about clear value when ppl input data on text field
Any idea?

 
<form action="http://www.packagetrackr.com/track/" method="get" name="track" target="_blank">
<div class="form-field-error-message hidden" style="display: none; ">
<div class="CommonEmptyTrackingNumber"></div>
</div>

<div id="track-form-tracking-number-container">
  <div id="track-form-tracking-number-inner-container" class="track-form-control-boxer"><input id="track-form-tracking-number" class="track-form-element " type="text" name="n" value="Type a tracking number" title="Type a tracking number..." onFocus="if(/^Type a tracking number...$/i.test(this.value)){this.value='';}" onBlur="if(this.value==''){this.value='Type a tracking number...';}">
  <input value="Track!" name="submit" type="submit" title="Track your package" class="track-form-submit-button sprite-master">
</div>
</div>
<div id="track-form-jss-carrier-container" class="hidden" style="z-index: 1000; display: none; ">
<div id="track-form-jss-carrier-content">
<label id="jss-carrier-auto" class="track-form-jss-carrier-label jss-carrier-label">
<input id="jss-carrier-auto-value" value="" type="radio" name="c" checked="checked"> <span>Auto Detect Carrier</span>
</label>
</div>
</div>
</form>

[xelawho]

why not do the same as you do onBlur, but in reverse?

onFocus="if(this.value=='Type a tracking number'){this.value=''}"

[dave_UK]

i would also use

autocomplete="off"

This clears Text from Input boxes on Refresh and stops Input Boxes from Saving previous inputs

[Logic Ali]

Your regex doesn't match the element's default value (...)

Do it like this: onfocus="if(this.value == this.defaultValue){this.value='';}"

From which you can work out how to code an onblur event handler that restores the original text if nothing is entered.

[fscaint]

Originally Posted by Logic Ali

Your regex doesn't match the element's default value (...)

Do it like this: onfocus="if(this.value == this.defaultValue){this.value='';}"

From which you can work out how to code an onblur event handler that restores the original text if nothing is entered.

missing text / delete by accident the element's default value (...) that why the script doesn't work properly, LOL

RESOLVED

[glenngv]

HTML5 supports placeholder attribute to provide hint to the input fields.

<input type="text" name="n" placeholder="Type a tracking number"  />

There are a lot of plugins out there to make this cross-browser compatible. Here's one of them:

http://davidwalsh.name/html5-placeholder