Stackoverflow Question

by kamranahmed_se

HTML

<input type="text" name="testInput" placeholder="Enter your value" />

JavaScript

replacePlHolders();

// replace all the placeholders with a simple text input
function replacePlHolders()
{
   var plInps = $("input[placeholder]");

   plInps.each(function(){
        var name=$(this).attr("name");
        var newInput = $("<input type='text' name='"+name+"' value='"+name+" goes here'>");

         $(this).replaceWith(newInput);
var defaultValue = name + " goes here";
             newInput.on('focus', function() {                 
                    
                    // If this value of the input equals our sample,
                    // hide it when the user clicks on it.
                    if(this.value === defaultValue)
                       this.value = '';
              });

              newInput.on('blur', function() {
                    // When they click off of the input, if
                    // the value is blank, bring back the sample.
                    if(this.value === '')
                         this.value = defaultValue;
               });
   });
}