取输入值并显示div

Question

How I can show a div defined by an input's value?

For example if I type dress in the input field #showme will show.

<form>
  <input type="text" id="desc" value="" onKeyUp="myFunction()"/>
  <div id="showme">
    <input type="text" value="" />
    <input type="text" value="" />
  </div>

I tried this, but it's unfortunately not working

<script language="javascript" type="text/javascript">
  function myFunction()
    {
        var input = document.getElementById('desc')
        var div = document.getElementById('showme');
        div.innerHTML = div.innerHTML + input.value;
    }
</script>

Answer 1

On you myFunction method, after selecting the showme div you can make it visible by setting visibility to visible:

    div.style.visibility = "visible";

JSFiddle Demo

Answer 2

You could do something like

 function myFunction(el) { var div = document.getElementById('showme'); var descval = document.getElementById('descval'); descval.innerHTML = el.value; div.style.display = el.value == 'dress' ? 'block' : 'none'; } 

 #showme { display: none; } 

 <form> <input type="text" id="desc" value="" onKeyUp="myFunction(this)" /> <div id="showme"> <input type="text" value="" /> <input type="text" value="" /> <!-- a span is used here so that there wouldn't be multiple appends --> <span id="descval"></span> </div> </form>