Use jQuery to dynamically add "placeholder" text in form inputs that do not support the HTML5 "placeholder" attribute

placeholder

<input type="text" placeholder="sample text">

<script>
function hasPlaceholder()
{   	
	var psuedoInput = document.createElement("input");
	return "placeholder" in psuedoInput
}

$(document).ready(function(){
  
  if(!hasPlaceholder())
  {
    $("input").each(function(){
  			input = $(this); 
				if( input.attr('placeholder') != 'undefined' && input.attr('placeholder'))
				{	    
					var placeholderTxt = input.attr('placeholder');
					if($.trim($(this).val()) == '')
					{
						input.val(placeholderTxt); // on load, give it placeholder value
					}
					
					input.on('focus',function(){
						if( $(this).val() == placeholderTxt)
						{
							$(this).val('');
						}
					})
					.on('blur',function(){
						if( $.trim($(this).val()) == '')
						{
							$(this).val(placeholderTxt);	
						}
					});		
				}	
			}); // end each through all inputs
			
			// when a form is submitted, remove any placeholder text
            $("form").submit(function(){
				$("input").each(function(){
					input = $(this); 
					if( input.attr('placeholder') != 'undefined' && input.attr('placeholder') && $(this).val() == input.attr('placeholder') )
					{	
						$(this).val('');
					}
				});
			});  

  }

});
</script>