Verzögertes Maskieren von Passworteingaben (+ jQuery-Plugin)

[globe]

n'abend,

http://blog.decaf.de/2009/07/iphone-like-password-fields-using-jquery/

Der Ansatz scheint zu funktionieren. Beim Überfliegen des Codes sind mir die einen oder anderen Dinge aufgefallen:

1. Funktionsweise von jQuery.extend()
   var opts = $.extend(defaults, options);
   A Plugin Development Pattern behauptet, dass du $.extend( {}, defaults, options ) ausführen möchtest.

2. Mehrere Variablen deklarieren

var opts    = $.extend(defaults, options);  
var checker = new Array();  
var timer   = new Array();

könnte auch wie folgt notiert werden:

var opts = $.extend( {}, defaults, options ),  
  checker = [],  
  timer = [];

3. Redundanten Code vermeiden

// get original password tag values  
var name        = $(this).attr('name');  
var id          = $(this).attr('id');  
var cssclass    = $(this).attr('class');  
var style       = $(this).attr('style');  
var size        = $(this).attr('size');  
var maxlength   = $(this).attr('maxlength');  
var disabled    = $(this).attr('disabled');  
var tabindex    = $(this).attr('tabindex');  
var accesskey   = $(this).attr('accesskey');  
var value       = $(this).attr('value');

Das ständige $(this) bedeutet unnötige Aufwand (prüfen ob jQuery Objekt bereits existiert, aus cache holen). ein var $this = $(this); tut in sachen Speicherverbrauch nicht weh, reduziert aber unnötige Arbeit.

Wenn du eine ganze Litanei von ähnlich zu verarbeitetenden Werten hast, bietet es sich an den kram in einer Schleife zu erledigen:

var attributes = [ 'name', 'id', 'class', 'style', 'size', 'maxlength', 'disabled', 'tabindex', 'accesskey', 'value' ],  
  data = [],  
  $this = $(this);  
  
$.each( attributes, function()  
{  
  var key = this + "";  
  data[ key ] = $this.attr( key );  
});

4. Scope Scope Scope

getId = function(id) {  
/* ... */  
}

Diese anonyme Funktion ist im globalen Scope richtig aufgehoben? Möchtest du der _Wertzuweisung_ noch ein Semikolon anhängen, damit beim Minifizieren nichts kaputt geht? Etwa so:

var getId = function(id) {  
/* ... */  
};

5. write less, do the same
   tmp = tmp + unescape(opts.replacement); kann auch als tmp += unescape(opts.replacement); notiert werden.

weiterhin schönen abend...