原生js监听用户是否录入全部信息，录入后显示提交按钮

html部分

<form action="" method="POST" name="" >
    <label for="" class="username">
        <i></i>
        <input type="text" placeholder="用户名或邮箱" name="username" id="username">
    </label>
    <label for="" class="password">
        <i></i>
        <input type="text" placeholder="用户名或邮箱" name="password" id="password">
    </label>
    <label for="" class="code" class="flex">
        <i></i>
        <input type="text" placeholder="验证码" name="code" id="code">
        <span><img src="static/images/code.png" alt=""></span>
    </label>
    <label for="" class=" submit-icons" id="submit-default">
        <span class="submit-btn">登录</span>
    </label>
    <label for="" class=" submit-icons" id="submit-allowed">
        <input class="submit-btn" type="submit" value="登录">
    </label>
    <div class="forget">
        <a href="user-forget.html">忘记密码？</a>
    </div>
</form>

js部分

<script>
document.getElementById('username').addEventListener('input', checkInputs);  
document.getElementById('password').addEventListener('input', checkInputs);  
document.getElementById('code').addEventListener('input', checkInputs);  
  
function checkInputs() {  
    var username = document.getElementById('username').value;  
    var password = document.getElementById('password').value;  
    var code = document.getElementById('code').value;  
  
    if (username != '' && password != '' && code != '') {  
        document.getElementById('submit-allowed').style.display = 'block';  
        document.getElementById('submit-default').style.display = 'none';  
    } else {  
        document.getElementById('submit-allowed').style.display = 'none';  
        document.getElementById('submit-default').style.display = 'block';  
    }  
}
</script>

附注