纯html+jquery实现 密码强度提示功能

验证有些简单只验证的字符长度

HTML代码

 电话<input type='text' id='phone' /><span class='s1'>底</span><span class='s1'>中</span><span  id='a1'class='s1'>高</span>

jquery代码

 $('.s1').hide(0);
            $('#phone').keydown(function () {
                var len = $('#phone').val().length;
                if (len > 4 && len <= 6)
                { $('.s1:eq(0)').show(); $('.s1:eq(0)').css('background-color', 'red'); $('.s1:gt(0)').attr('style','display:none'); }
                else if (len > 6 && len <= 8)
                { $('.s1:lt(2)').show(); $('.s1:lt(2)').css('background-color', 'Yellow'); $('.s1:eq(2)').attr('style', 'display:none'); }
                else if (len > 8)
                { $('.s1').show(); $('.s1').css('background-color', 'green'); }
                else
                    $('.s1').hide(0);
            })