隐藏一个div，如果一个select是空的

Question

我有 6 个 select 分别包裹在它们自己的 div 中，如果 select 是空白，我想隐藏整个 div。

<div>
   <select>
     <option></option>
     <option>1</option>
    </select>
 </div>  <--- Hide this div if blank option is chose.

Answer 1

你在追求这样的东西吗？这是根据您的选择隐藏一个单独的 div。在您的问题中，如果选择为空，您将隐藏选择本身。如果这样做，一旦 select 消失，您如何更改您的选择？

var checkTheCat = function(index) {
  if( !index ) hideTheCat();
  else showTheCat();
}

var hideTheCat = function() {
  document.getElementById("toHide").style.display = 'none';
}
var showTheCat = function() {
  document.getElementById("toHide").style.display = 'block';
}

<div id="toHide">
  <img src="https://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg" style="height:100px;">
</div>
Please select below:<br>
<select id="selection" onChange="checkTheCat(this.selectedIndex);">
  <option>Blank option</option>
  <option>The Cat</option>
  <option>Another non-blank option</option>
<select>

隐藏一个div，如果一个select是空的

Hiding a div, if a select is empty

hide