Jquery ile şifre zorluk derecesini ölçme

Anasayfa / JQuery / Jquery ile şifre zorluk derecesini ölçme

30 Haziran 2021 / 22:33

Burak

Merhabalar,

Jquery ile girilen şifrenin zorluk derecesini gösteren modül kullanmak isterseniz aşağıdaki kodu kullanabilirsiniz.

Burda ” sifre_txt ” alanı girilen textbox id si kendinize göre düzenliceksiniz. ” security ” yazan yer ise sonucun yazılacagı div id sini yazıcaksınız

<script>
jQuery(document).ready(function ($) {
$('#sifre_txt').keyup(function (e) {
var guclukarakter = 8; 
var ortakarakter = 7;
var gecerkarakter = 6; 
var strongRegex = new RegExp("^(?=.{" + guclukarakter + ",})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
var mediumRegex = new RegExp("^(?=.{" + ortakarakter + ",})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
var enoughRegex = new RegExp("(?=.{" + gecerkarakter + ",}).*", "g");
if (false == enoughRegex.test($(this).val())) {
$('#security').removeClass();
$('#security').addClass('azkarakter');
$('#security').html('En az ' + gecerkarakter + ' karakter!');
} else if (strongRegex.test($(this).val())) {
$('#security').removeClass();
$('#security').addClass('tamamdir');
$('#security').html('Güçlü!');
} else if (mediumRegex.test($(this).val())) {
$('#security').removeClass();
$('#security').addClass('idareeder');
$('#security').html('Orta!');
} else {
$('#security').removeClass();
$('#security').addClass('kullanmadahaiyi');
$('#security').html('Güçsüz!');
}
return true;
});
});
</script>
<style>
.kullanmadahaiyi,.idareeder,.tamamdir,.azkarakter{
display: inline-block;
border: 0px;
min-width: 120px;
min-height: 20px;
/* line-height: 20px; */
font-size: 13px;
font-weight: bold;
padding-left: 5px;
width: 100%;
margin-top: 12px;
line-height: 25px;
}
.kullanmadahaiyi{
color:#FFF;
background:#FF0000;
}
.tamamdir{
color:#FFF;
background:green;
}
.idareeder{
background: yellow;
}
.azkarakter{
color:#FFF;
background:#000;
}
</style>

jQuery(document).ready(function ($) {

$('#sifre_txt').keyup(function (e) {

var guclukarakter = 8;

var ortakarakter = 7;

var gecerkarakter = 6;

var strongRegex = new RegExp("^(?=.{" + guclukarakter + ",})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");

var mediumRegex = new RegExp("^(?=.{" + ortakarakter + ",})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");

var enoughRegex = new RegExp("(?=.{" + gecerkarakter + ",}).*", "g");

if (false == enoughRegex.test($(this).val())) {

$('#security').removeClass();

$('#security').addClass('azkarakter');

$('#security').html('En az ' + gecerkarakter + ' karakter!');

} else if (strongRegex.test($(this).val())) {

$('#security').removeClass();

$('#security').addClass('tamamdir');

$('#security').html('Güçlü!');

} else if (mediumRegex.test($(this).val())) {

$('#security').removeClass();

$('#security').addClass('idareeder');

$('#security').html('Orta!');

} else {

$('#security').removeClass();

$('#security').addClass('kullanmadahaiyi');

$('#security').html('Güçsüz!');

}

return true;

});

</script>

<style>

.kullanmadahaiyi,.idareeder,.tamamdir,.azkarakter{

display: inline-block;

border: 0px;

min-width: 120px;

min-height: 20px;

/* line-height: 20px; */

font-size: 13px;

font-weight: bold;

padding-left: 5px;

width: 100%;

margin-top: 12px;

line-height: 25px;

}

.kullanmadahaiyi{

color:#FFF;

background:#FF0000;

}

.tamamdir{

color:#FFF;

background:green;

}

.idareeder{

background: yellow;

}

.azkarakter{

color:#FFF;

background:#000;

}

</style>

Sonuç

Etiketler: Jquery ile şifre zorluğunu gösterme, Jquery ile şifre zorluk alanı

Bu Yazılarıda Okuyabilirsiniz...

Telefon Maskeleme (inputmask) Kullanımı

Datatables’da Arama Kutusunu Gizleme

Jquery Sürükle Bırak Sıralama ( Drag And Drop )

Resimleri Popup Açtırma ( Fancybox )

Datatables Tarih’e Göre Sıralama

Kategoriler

Sosyal Medya

Bir yanıt yazın Yanıtı iptal et