如何使用Jquery显示无效反馈

Question

我试图在数据为空时显示无效的反馈，当我在下面使用此代码并尝试清空字段时，这是可行的，但是无效反馈的文本仍显示为消失当我再次被点赞一次时，消失。

<script type="text/javascript">

    $('#nama').blur(function() {
    if( $(this).val() != '' ) {
          $('#invalid-nama').css("display", "none");
    }else{
    $('#invalid-nama').css("display", "unset");
    }
});
</script> 

然后我尝试在用户键入但不起作用时将&& $（this）.keypress（function（））放入IF中。>

<script type="text/javascript">

    $('#nama').blur(function() {
    if( $(this).val() != '' && $(this).keypress(function()) ) {
          $('#invalid-nama').css("display", "none");
    }else{
    $('#invalid-nama').css("display", "unset");
    }
});
</script> 
所以问题是如何在数据为空并且在字段中键入后无效反馈消失时显示无效反馈，谢谢

我试图在数据为空时显示无效反馈，当我在下面使用此代码并尝试清空字段时，它是有效的，但无效反馈的文本仍显示它消失了...

Answer 1

function errorMessageDisplay(){
  if($("#input").val() ==''){
    $("#errorMessage").text("Error").show();
  }else{
    $("#errorMessage").text("").hide();
  }
}

$("#input").blur(function(){
  errorMessageDisplay();
}).keyup(function(){
  errorMessageDisplay();
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="input" type="text" />
<div id="errorMessage" style="color: red"></div>

Answer 2

    <script>
        $(document).ready(function() {
            $('#nama').keyup(function() {
                if( $(this).val() != '') {
                      $('#invalid-nama').css("display", "none");
                }else{
                $('#invalid-nama').css("display", "unset");
                }
            });
        });
    </script> 
    <style type="text/css">
        #invalid-nama {
            display: none;
        }
    </style>
    <form>
    <input type="text" id ="nama">
    <div id ="invalid-nama">Invalid</div>
    </form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>