使用 jQuery 检查 HTML 输入字段中的输入 live/with 击键

Question

我需要找到一种方法来在字段有任何输入时隐藏 ID 为 'forgot' 的跨度。 'forgot' 范围唯一可见的时间是字段为空时。

<form>
    <input type="text" name="username" placeholder="Username or E-mail" autofocus><br>
    <input type="password" name="password" id='pass' placeholder="Password"><br>
    <span id="forgot">( <a class="forgot" href="<?php echo $dom; ?>forgot/">forgot?</a> )</span>
    <input type="submit" value="Login">
</form>

我目前有这个脚本....

$(document).ready(function() {
    $(document).keypress(function() {
        var value=$.trim($("#pass").val());
        if (value.length==0) {
            $('#forgot').css("display","initial");
        } else {
            $('#forgot').css("display","none");
        }
    }
});

有没有更好的方法来检查用户的实时输入并将其发送到运行函数？

Answer 1

 $(document).ready(function() {
    $(document).on('keypress', '#pass', function() {
        var value = $(this).val();
        if (value.length) {
            // $('#forgot').css("display", "block");
            // Or
            $('#forgot').show();
        } else {
            // $('#forgot').css("display", "none");
            // Or
            $('#forgot').hide();
        }
    });
});

您不应在 document 上添加活动，而应在 pass 上添加活动
使用show/hide函数
使用display：block代替initial
无需与==0

Answer 2

$(document).on('input', '.Required', function(){
    var required = false;
    var elems = $('.Required');
    for(var i in elems){
    if($(elems[i]).val() == ''){
       required = true;
    }
}
if(required){
  $('#forgot').show();
}else{
  $('#forgot').hide();
}

 });

在我的手机上，untested.Add class 需要输入字段。它应该显示任何具有该 class 名称的字段。

使用 jQuery 检查 HTML 输入字段中的输入 live/with 击键

Checking for input live/with key strokes in HTML input field with jQuery

html

forms

jquery

field

live