jQuery: disable form autocomplete in browsers

With jQuery we can prevent browsers from adding their own autocompletion features to forms.

An unofficial but working solution implies the addition of an hidden input element at the very beginning of a form. Here's a simple plugin.

(function( $ ) {
    $.fn.noAutocomplete = function() {
        return this.each(function() {
            var $element = $( this );
            if( $element.is( "form" ) ) {
                $element.attr( "autocomplete", "off" ).prepend( '<input type="text" style="display: none" autocomplete="off" aria-hidden="true">' );
            }
        });
    };
})( jQuery );

Note that here we have used the WAI-ARIA specific attribute on our input element because its purpose is merely visual and behavioral.