如果輸入值爲空，則移除父div，如果輸入值不爲空，則顯示父div？

我想刪除父div如果輸入值爲空，並顯示父div如果輸入值不爲空？如果輸入值爲空，則移除父div，如果輸入值不爲空，則顯示父div？

輸入字段的值是動態的，這意味着它的值是另一個輸入字段的值，我用javascript來做這個。

到目前爲止由於某種原因，我一直無法顯示/隱藏父div。我懷疑原因是因爲輸入字段的值是動態的，這意味着用戶不在該輸入字段中輸入任何內容。他們正在輸入另一個輸入字段，動態輸入字段的值會相應更新。

這裏是我迄今爲止的顯示/隱藏父DIV：

HTML：

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

JAVASCRIPT：

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

可能有人請幫助我嗎？

來源

2014-03-19 user3343724

你要運行一段時候只要你更新的價值 – adeneo

代碼，我可以看到只有一個輸入字段中輸入您上面的代碼，其他曾經更新這個字段的地方在哪裏？ – mystic

@mystic，因爲這是我需要根據其價值刪除父div的div。 – user3343724

總結你的代碼的事件處理程序：

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

這樣，無論您何時更新輸入，因此在div狀態的變化。

來源

2014-03-19 13:14:41

這不會做任何事情。抱歉。 – user3343724

我不知道它是否適用於您，但請遵循解決方案。
我創建了另一種輸入類型的主div來模擬情況。
我用jQuery。之後，你可以設置自己的CSS。

HTML

<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">

的Javascript（jQuery的）

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

Here is the fiddle

來源

2014-03-19 14:14:16

如果輸入值爲空，則移除父div，如果輸入值不爲空，則顯示父div？

回答

相關問題