Snap Builder Public Codes Library
Snap | Generators | Login | Browse | Search | Enter Code | Export Snap Builder Public Codes Library

 

Category: Javascript Codes Library >> Forms, Radio, Buttons, Check Box >> Clear Form Field Text Box Elements


Code Snippet </> Info


Snippet Name: Clear Form Field Text Box Elements

Description: Easily insert small description messages inside your form field text box elements and have them disappear onFocus.
Compatible Modern Browsers:
Chrome BrowserFirefox BrowserInternet Explorer BrowserOpera BrowserSafari Browser

Example: View Code Demo

Note:

Author: Gene Davis

Last Modified: 2019-12-09 02:41:08

Language: javascript

Highlight Mode: javascript

Copy Codes: Use Free Notepad ++
Bookmark and Share

Snap HTML Code Editor:
Paste the source code, make changes and instantly see it in live preview.
Snap HTML Code Editor


  About Copying
Copied To Clipboard!

<!doctype html> <html lang="en"> <head> <title>onFocus Clear Form Field Text Box Elements Javascript Code Snippet</title> </head> <body> <h3 align="center">onFocus Clear Form Text Field Element Javascript Snippet Code</h3> <p>Example of a form field text element needing to be cleared onFocus:</p> <script> <!-- // Begin Clear Form Field Text Box Elements Javascript Snippet Code // == This Script Free To Use Providing This Notice Remains == // // == This Script Has Been Found In The https://snapbuilder.com Free Public Codes Library == // // == NOTICE: Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply == // // == Created by: Gene Davis : http://www.csgnetwork.com : Creative Commons License 3.0+ == // function clearfield(field) { field.value='' } // clears the field box of default value function clear_field(field) { if (field.value==field.defaultValue) { field.value='' } } // --> </script> <form> <input type="text" name="example" value="this is text to clear" onFocus="clear_field(this)";"> </form> <p>Input Code Example: <code>input type='text' value='this is text to clear' onFocus='clear_field(this)'</code></p> <p>How to insert your word text inside the form text field element boxes:</p> <p>We recommend using the free <a href="http://notepad-plus-plus.org/download/" target="_new">Notepad ++ source code editor</a>.</p> <p>You can copy the <code>onFocus='clear_field(this)';</code> code and paste it to all of your form field elements that you need to clear onFocus.</p> <p>In your form field elements add your own text message <code>value='your text here'</code></p> <p>When the visitor clicks on the form field text element boxes, the <code>value='text message'</code> is cleared onFocus.</p> </body> </html>


[ Snippet Options ]

 

© 2002 -  Snap Builder Public Codes Library