パスワードの強度を明示するJavaScript「jQuery Password plugin」

フォームに入力されるパスワードが安易すぎて憂鬱になる運営者の皆様へ。
JavaScriptライブラリjQueryプラグインの「jQuery Password plugin」を使用して、その憂鬱さを晴らしましょう。
パスワードの強度を判別し、一定以下だと登録できなくなくします。
パスワードの強度を明示するJavaScript「jQuery Password plugin」サンプル

使用方法
jQuery Password pluginからjquery.passroids.jsを、jQueryからjquery.jsをダウンロードします。
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.passroids.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('form').passroids({
main: '#password', //メイン用ID
verify: '#password2', //確認用ID
button: '#mysubmit', //ボタンID
minimum: 2 // 申し込める強度レベル(0 = no requirement/weak, 1 = Medium, 2 = Strong, 3 = Excellent).
});
}); </script>

上記を記述後、対応するIDをformに付与します。
<form onsubmit="return false;">
パスワード:<br />
<input type="password" id="password" /><br />
パスワード確認:<br />
<input type="password" id="password2" />
<br />
<input type="submit" value="Submit" id="mysubmit" />
</form>

これで完成です。
なお、jquery.passroids.js内を変更することで、表示するテキストをサンプルのように調整できます。

パスワードの強度を明示するJavaScript「jQuery Password plugin」サンプル

sponsors

「パスワードの強度を明示するJavaScript「jQuery Password plugin」」をシェアする

記事作成:
記事URL:

TOP > > > パスワードの強度を明示するJavaScript「jQuery Password plugin」