隱藏所有條件後的工具提示彈出得到滿足

我有一個jquery密碼驗證直播形式HERE隱藏所有條件後的工具提示彈出得到滿足

這個例子引導添加正確的密碼，並用紅色和綠色標誌顯示。

但我想要的東西，當所有的密碼條件成功，然後彈出式工具提示將自動消失。

這怎麼可能。我不擅長jquery，任何幫助將不勝感激。

$(document).ready(function() { 


    $('input[type=password]').keyup(function() { 

     // set password variable 
     var pswd = $(this).val(); 
     if (pswd.length < 8) { 
       $('#length').removeClass('valid').addClass('invalid'); 
      } else { 
       $('#length').removeClass('invalid').addClass('valid'); 
      } 


        //validate letter 
      if (pswd.match(/[A-z]/)) { 
       $('#letter').removeClass('invalid').addClass('valid'); 
      } else { 
       $('#letter').removeClass('valid').addClass('invalid'); 
      } 

      //validate capital letter 
      if (pswd.match(/[A-Z]/)) { 
       $('#capital').removeClass('invalid').addClass('valid'); 
      } else { 
       $('#capital').removeClass('valid').addClass('invalid'); 
      } 

      //validate number 
      if (pswd.match(/\d/)) { 
       $('#number').removeClass('invalid').addClass('valid'); 
      } else { 
       $('#number').removeClass('valid').addClass('invalid'); 
      } 


    }); 
    $('input[type=password]').focus(function() { 
     // focus code here 
    }); 
    $('input[type=password]').blur(function() { 
     // blur code here 
    }); 

    $('input[type=password]').keyup(function() { 

    // keyup code here 
    }).focus(function() { 
     $('#pswd_info').show(); 
    }).blur(function() { 
     $('#pswd_info').hide(); 
    }); 


});

來源

2013-12-23 Raihan

的驗證號和驗證大寫規則是多餘的。如果驗證大寫字母爲真，那麼驗證字母也是如此。你可以有一個像'1234567A'這樣的密碼，這可能不是什麼意思。 –

一種方法是計算的有效規則的數量，當你達到相應的數量，淡化規則了：

if ($('#pswd_info li.valid').length == 4) $('#pswd_info').fadeOut();

jsFiddle example

來源

2013-12-23 20:09:01 j08691

你好，謝謝你的最佳答案。當所有的條件都是很好的工具提示隱藏時，我還有一個類似於您的解決方案的問題，但是如果我使用退格空間，並且任何條件分解彈出窗口都會再次增加？我不確定這是否會非常困難。如果您對此有任何想法，請告訴我。 – Raihan

只需在if後添加：'else $（'＃pswd_info'）。show（）;' – j08691

這將您KEYUP內工作（）函數：

if(pswd.length >= 8 && pswd.match(/[A-z]/) && pswd.match(/\d/)) { 
    $('#pswd_info').hide(); 
}

更新JSFiddle

來源

2013-12-23 20:09:14 Enijar

完美！謝謝:) – Raihan

@Raihan爲什麼你不接受我的回答？ – Enijar

是的，我注意到大寫字母和字母沒有問題。兩者都行事相同。 – Raihan

這裏是一個工作版本（jsfiddle）：

$(document).ready(function() { 


    $('input[type=password]').keyup(function() { 
     var isValid = true; 

     // set password variable 
     var pswd = $(this).val(); 
     if (pswd.length < 8) { 
         isValid &= false; 
         $('#length').removeClass('valid').addClass('invalid'); 
      } else { 
         isValid &= true; 
         $('#length').removeClass('invalid').addClass('valid'); 
      } 


        //validate letter 
      if (pswd.match(/[A-z]/)) { 
         isValid &= true; 
         $('#letter').removeClass('invalid').addClass('valid'); 
      } else { 
       isValid &= false; 
         $('#letter').removeClass('valid').addClass('invalid'); 
      } 

      //validate capital letter 
      if (pswd.match(/[A-Z]/)) { 
         isValid &= true; 
         $('#capital').removeClass('invalid').addClass('valid'); 
      } else { 
         isValid &= false; 
         $('#capital').removeClass('valid').addClass('invalid'); 
      } 

      //validate number 
      if (pswd.match(/\d/)) { 
       isValid &= true; 
         $('#number').removeClass('invalid').addClass('valid'); 
      } else { 
       isValid &= false; 
         $('#number').removeClass('valid').addClass('invalid'); 
      } 

        if(isValid){ 
         $('#pswd_info').hide(); 
        } 

    }); 
    $('input[type=password]').focus(function() { 
     // focus code here 
    }); 
    $('input[type=password]').blur(function() { 
     // blur code here 
    }); 

    $('input[type=password]').keyup(function() { 

    // keyup code here 
    }).focus(function() { 
     $('#pswd_info').show(); 
    }).blur(function() { 
     $('#pswd_info').hide(); 
    }); 


});

來源

2013-12-23 20:15:08

這是迄今爲止我看到的最好之前的一個被接受，因爲沒有回答。當所有條件都滿足工具提示隱藏時，這也是可能的，如果我再次用退格鍵清除它們，工具提示會出現嗎？ – Raihan

隱藏所有條件後的工具提示彈出得到滿足

回答

相關問題