diff --git a/README.md b/README.md index 26b5aa4..78f4149 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ ## Overview -jQuery Field Mask is a simple jQuery plugin that will mask your text fields with a password field. The user can toggle between the masked input and the unmasked version via a checkbox. The use case is to allow people to enter data on a public screen, such as a kiosk, and be able to have the data hidden until they click the reveal button. The masked fields do not interfere with the submission of the form. Just add a class to the input field and a control field and you will be done. +jQuery Field Mask is a simple jQuery plugin that will unmask your password fields with a text field. The user can toggle between the masked input and the unmasked version via a checkbox. The use case is to allow people to enter data on a public screen, such as a kiosk, and be able to have the data hidden until they click the reveal button. The unmasked fields do not interfere with the submission of the form. Just add a class to the input field and a control field and you will be done. ## Setup @@ -13,10 +13,10 @@ Include the script: ``` -Setup the field to mask and the field to toggle the mask: +Setup the field to unmask and the field to toggle the mask: ``` - + ``` diff --git a/example/js/mask.js b/example/js/mask.js index 1341469..4a96818 100644 --- a/example/js/mask.js +++ b/example/js/mask.js @@ -13,15 +13,15 @@ var $controls = $(settings.toggle); //helper function - function createMask(unmasked) { - var new_id = unmasked.attr('id') + '_masked'; + function createUnmask(masked) { + var new_id = masked.attr('id') + '_unmasked'; var new_input = document.createElement("input"); new_input.setAttribute("id", new_id); - new_input.setAttribute("type","password"); + new_input.setAttribute("type","text"); new_input.setAttribute("style","display:none;") - new_input.value = unmasked.val(); - unmasked.after(new_input); - return $('#'+new_id); + new_input.value = masked.val(); + masked.after(new_input); + return $(new_input); } //bind the controls @@ -38,8 +38,8 @@ }); return this.each(function() { - var unmasked = $('#'+this.id); - var masked = createMask(unmasked); + var masked = $(this); + var unmasked = createUnmask(masked); this.reveal = function() { unmasked.show(); @@ -65,4 +65,4 @@ }); }; -})(jQuery); \ No newline at end of file +})(jQuery); diff --git a/example/multiple-fields.html b/example/multiple-fields.html index 4b545e0..ccb9a05 100644 --- a/example/multiple-fields.html +++ b/example/multiple-fields.html @@ -24,11 +24,11 @@
- +
- +
diff --git a/example/single-fields.html b/example/single-fields.html index 35a582b..1f3689b 100644 --- a/example/single-fields.html +++ b/example/single-fields.html @@ -20,7 +20,7 @@