keyUp上的搜索输入

我正在尝试创建一个登录表单，它将检查密码强度并更改条的属性。现在我试图简单地检查密码输入是否包含单个字母。keyUp上的搜索输入

HTML：

<input type="password" id="pass" name="password" placeholder="Password" required><br><br> 
<div id="strength"> 
    <div id="bar"></div> 
</div>

JS：

$("#pass").keyUp(function(){ 
    var pass = $("#pass"); 
    if(pass.val().indexOf("a") >= 0){ 
     $("#bar").css("width","70%"); 
    } 
});

当我输入 'A' 在输入框中它不会改变，虽然在CSS。有人可以解释如何做到这一点？在此先感谢

来源

2016-02-29 Norbert D

-1

试试这个，我希望这是你的答案

$("#pass").on("keyup", function(){ 
    var $pass = $("#pass"); 
    if($pass.val().indexOf("a") != 0){ 
     document.getElementById('bar').style.width = 'y0%'; 
    } 
});

来源

2016-02-29 19:46:25 Shayan

这与OP的做法有什么不同？也indexOf（“a”）！= -1不是0. – noahnu

@noahnu对不起，我改变了答案。检查它 – Shayan

我hnestly不知道，但它的工作。我只是用“> =”取代了“！=”，因为我希望它在不是时候被执行，当它不是 –

你在你的函数调用keyUp大写U。它应该全部小写。

$("#pass").keyup(function(){ 
 
    var pass = $("#pass"); 
 
    if(pass.val().indexOf("a") >= 0){ 
 
     $("#bar").css("width","70%"); 
 
    } 
 
});

#strength {width: 100%;} 
 
#bar {height: 1em; background: red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" id="pass" name="password" placeholder="Password" required><br><br> 
 
<div id="strength"> 
 
    <div id="bar"></div> 
 
</div>

来源

2016-02-29 19:50:53 Quantastical

哦....哇....我的错。非常感谢 –

我如何做同样的事情，但对于一系列的投入？例如，来自a-z和A-Z的所有字符？ –

使用[正则表达式]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions）。查看@itsgoingdown的答案http://stackoverflow.com/a/35708433/1028949 – Quantastical

刚才看你的情况，这里的docs您的原始代码 “使用keyUp”，它失败了，在这里我改成了 “KEYUP”

$("#pass").keyup(function(){ 
    var pass = $("#pass"); 
    if(pass.val().indexOf("a") >= 0){ 
     $("#bar").css("width","70%"); 
    } 
});

这里有一个fiddle link。

来源

2016-02-29 19:52:23 bmcculley

$("#pass").on("keyup", function(){ 
     var $pass = $("#pass"); 
     if($pass.val().indexOf("a") > -1){ 
     $("bar").css("width","70%"); 
     } 
    });

来源

2016-02-29 19:54:28

keyUp上的搜索输入

回答

相关问题