Jquery: focus and blur on the password input field

JavaScript
1

Hi,

I only want to set the code to alert one when I am out of ‘focus’ but the alert keeps piling up if I click on the input field and out of ‘focus’ more than one?

http://nano-visions.net/dump2/focus/

$(document).ready(function(){
      
      $(function() {
        $('#test-form-1 *[title]').inputHint();
      
      });
      
      $(".input-password").each(function(){
    	
    		if($(this).length > 0)
    		{
    			/* create the password input next to the current input and hide the password input */
    			var val_name = $(this).attr('name');
    			$(this).after("<input name='"+val_name+"' type='password' value='' />");
    			$(this).next().hide();
    			
    			/* on focus */
    			$(this).focus(function () {
    
    				/* hide the input and display the next input and put focus on it */
    				$(this).hide();
    				$(this).next().show().focus();
    				
    				//alert($(this).parent().html());
    				//var keep_html = $(this).parent().html()
    				
    				/* on blur */
    				$(this).next().blur(function(){
    					
    					/* if the password input is empty */
    					if($(this).val() == '')
    					{
    						$(this).hide();
    						$(this).prev().show();
    						$('form *[title]').inputHint();
    					}
    					alert($(this).parent().html());
    					
    				})
    			});
    			
    			
    		}
    	});
    	
    });

the html

 <form method="post" id="test-form-1">
      <div><input value="" class="hint input-password" title="Password" name="password" type="text"></div>
    </form>

Have I coded something wrong? how can I fix it?

Thanks!

2

You would have to add some kind of “blur count” variable (using .data) on each field to keep track of the number of times the field has lost focus. If this value is smaller than 1, then fire the alert, otherwise do nothing