| 提交 | 用户 | 时间 | ||
| 58d006 | 1 | ==================================================== |
| A | 2 | jQuery Password Strength Meter for Twitter Bootstrap |
| 3 | ==================================================== | |
| 4 | ||
| 5 | The jQuery Password Strength Meter is a plugin for Twitter Bootstrap that | |
| 6 | provides rulesets for visualy displaying the quality of a users typed in | |
| 7 | password. | |
| 8 | ||
| 9 | ||
| 10 | Requirements | |
| 11 | ============ | |
| 12 | ||
| 13 | * jQuery (tested with 1.8.3) | |
| 14 | * Bootstrap CSS for progress bars (tested with 2.2.2) | |
| 15 | ||
| 16 | ||
| 17 | Options | |
| 18 | ======= | |
| 19 | ||
| 20 | * __minChar__: | |
| 21 | ||
| 22 | Default: `8` (Integer) | |
| 23 | ||
| 24 | Sets the minimum required of characters for a password to not be considered | |
| 25 | too weak | |
| 26 | ||
| 27 | * __verdicts__: | |
| 28 | ||
| 29 | Default: `["Weak", "Normal", "Medium", "Strong", "Very Strong"]` (Array) | |
| 30 | ||
| 31 | The display names for the verdicts related to the progressClass | |
| 32 | ||
| 33 | * __scores__: | |
| 34 | ||
| 35 | Default: `[17, 26, 40, 50]` (Array) | |
| 36 | ||
| 37 | The scores used to determine what progressClass and verdicts to display | |
| 38 | ||
| 39 | * __showVerdicts__: | |
| 40 | ||
| 41 | Default: `true` (Boolean) | |
| 42 | ||
| 43 | Determines if the verdicts are display on the progress bar or not | |
| 44 | ||
| 45 | * __viewports__: | |
| 46 | ||
| 47 | Default: (Object) | |
| 48 | ||
| 49 | ``` | |
| 50 | { | |
| 51 | progress: undefined, | |
| 52 | verdict: undefined, | |
| 53 | errors: undefined | |
| 54 | } | |
| 55 | ``` | |
| 56 | ||
| 57 | An object containing the viewports to use to show the elements of the | |
| 58 | strength meter. Each one can be a CSS selector (`"#progressbar"`) or a DOM | |
| 59 | node reference. | |
| 60 | ||
| 61 | * __usernameField__: | |
| 62 | ||
| 63 | Default: `"#username"` (String) | |
| 64 | ||
| 65 | The username field to match a password to, to ensure the user does not use | |
| 66 | the same value for their password | |
| 67 | ||
| 68 | * __raisePower__: | |
| 69 | ||
| 70 | Default: `1.4` (Double) | |
| 71 | ||
| 72 | The value used to modify the final score, allows you to tailor your results | |
| 73 | ||
| 74 | * __onLoad__: | |
| 75 | ||
| 76 | Default: `undefined` (Function) | |
| 77 | ||
| 78 | A callback function, fired on load of the widget | |
| 79 | ||
| 80 | * __onKeyUp__: | |
| 81 | ||
| 82 | Default: `undefined` (Function) | |
| 83 | ||
| 84 | A callback function, fired on key up when the user is typing | |
| 85 | ||
| 86 | * __errorMessages__: | |
| 87 | ||
| 88 | Default: (Object) | |
| 89 | ||
| 90 | ``` | |
| 91 | { | |
| 92 | password_to_short : "The Password is too short", | |
| 93 | same_as_username : "Your password cannot be the same as your username" | |
| 94 | } | |
| 95 | ``` | |
| 96 | ||
| 97 | An object containing error messages. These can be overwritten for language | |
| 98 | purposes, and can also be added to for your custom rules. | |
| 99 | ||
| 100 | ||
| 101 | Adding Custom Rules | |
| 102 | =================== | |
| 103 | ||
| 104 | The plugin comes with the functionality to easily define your own custom rules. | |
| 105 | The format is as follows: | |
| 106 | ||
| 107 | ```javascript | |
| 108 | $("#passwdfield").pwstrength("addRule", "ruleName", function (options, word, score) {}, rule_score, rule_enabled); | |
| 109 | ``` | |
| 110 | ||
| 111 | Example: | |
| 112 | ||
| 113 | ```javascript | |
| 114 | $("#passwdfield").pwstrength("addRule", "testRule", function (options, word, score) { | |
| 115 | return word.match(/[a-z].[0-9]/) && score; | |
| 116 | }, 10, true); | |
| 117 | ``` | |
| 118 | ||
| 119 | ||
| 120 | Callback Functions | |
| 121 | ================== | |
| 122 | ||
| 123 | The plugin provides two callback functions, onLoad and onKeyUp. You can use | |
| 124 | them like this: | |
| 125 | ||
| 126 | ```javascript | |
| 127 | $(document).ready(function () { | |
| 128 | var options = { | |
| 129 | onLoad: function () { | |
| 130 | $('#messages').text('Start typing password'); | |
| 131 | }, | |
| 132 | onKeyUp: function (evt) { | |
| 133 | $(evt.target).pwstrength("outputErrorList"); | |
| 134 | } | |
| 135 | }; | |
| 136 | $(':password').pwstrength(options); | |
| 137 | }); | |
| 138 | ``` | |
