Javascript 如果输入值为空，则删除父div；如果输入值不为空，则显示父div？

如果输入值为空，我尝试删除父div；如果输入值不为空，则尝试显示父div

输入字段的值是动态的，这意味着它的值是另一个输入字段的值，我使用javascript来实现这一点

到目前为止，由于某些原因，我无法显示/隐藏父div。我怀疑原因是因为输入字段的值是动态的，这意味着用户没有在输入字段中键入任何内容。他们正在输入另一个输入字段，动态输入字段的值会相应地更新

以下是我到目前为止为显示/隐藏父div所做的工作：

HTML:

JAVASCRIPT:

<script type="text/javascript">
if(document.getElementById("sect2").value == ""){
document.getElementById("BOTTEXT2").style.display="block";
}
</script>

if（document.getElementById（“sect2”）.value==“”）{
document.getElementById（“BOTTEXT2”）.style.display=“block”；
}

---

有人能帮我解决这个问题吗？

将代码包装到事件处理程序中：

window.onload = function() {
    var input = document.getElementById('sect2');
    input.addEventListener('change', function() {
        document.getElementById('BOTTEXT2').style.display = (input.value ? 'block' : 'none');
    }, false);
};

---

这样，每当您更新输入时，div状态都会相应更改。

我不知道它是否适合您，但请遵循解决方案。
我在main div之外创建了另一个输入类型来模拟这种情况。
我使用jQuery。之后，您可以按自己的方式设置css

HTML

---

无论何时更新值，您都必须运行这段代码。在上述代码中，我只能看到一个输入字段，另一个字段在哪里更新了此字段？@mystic，因为这是我需要根据其值删除父div的div。这没有任何作用。很抱歉

window.onload = function() {
    var input = document.getElementById('sect2');
    input.addEventListener('change', function() {
        document.getElementById('BOTTEXT2').style.display = (input.value ? 'block' : 'none');
    }, false);
};

<div id="BOTTEXT2" class="secTxt">
    <input type="text" class="sect2" id="sect2" style="border:none; background:none; " value="BSAU145D" size="12"  readonly="readonly"/>            
</div>
<input type="text" id="sect1">

$(document).ready(function(){
    $('#sect1').keyup(function(){
        if($('#sect1').val() == 'test') {
            $('#BOTTEXT2').css({'display':'none'});
        } else {
            $('#BOTTEXT2').css({'display':'block'});
        }
    });
});