Advanced Search

Form label value show/hide

/ Published in: jQuery
Save to your folder(s)
Show/hide labels on focus/blur when using form values as labels.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. var formEl =  '#main .contact_form';
  2. if( $(formEl).length >0 ){	
  3. 	var labelArray = new Array();	
  4. 	for(i=0 ; i<$(formEl+' .inputText').length ; i++){
  5. 		labelArray[i] = $(formEl+' .inputText:eq('+i+')').attr('value');		
  6. 	}	
  7. 	$(formEl+' .inputText').focus(
  8. 		function(){			
  9. 			index = $(formEl+' .inputText').index(this);			
  10. 			if( $(this).attr('value') == labelArray[index] ){			
  11. 				$(this).attr('value','');
  12. 			}
  13. 		}).blur(function(){
  14. 			index = $(formEl+' .inputText').index(this);
  15. 			if( ($(this).attr('value') == labelArray[index]) || ( $(this).attr('value') == '') ){	
  16. 				$(this).attr('value',labelArray[index]);
  17. 			}
  18. 		});	
  19. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.