在列表框选择上隐藏div，javascript

Question

我试图在列表框选择中隐藏div。但是我没有得到我想要的结果。它隐藏在选择上但没有显示出变化。如果你看看代码，那么这就是这个。

<script type="text/javascript" language="javascript">
        function showtxt(mySel) {
            if (mySel != 0) {
                document.getElementById('textarea').style.visibility = 'visibile'
            }
            else
                document.getElementById('textarea').style.visibility = 'hidden'
        }

    </script>
<form action="">
  <label>Document Type</label>
<SELECT NAME="dtype" onchange="showtxt(this.form.dtype.value);">
  <OPTION SELECTED=selected value="0">Select A Document Type
  <OPTION value="1">C32</OPTION>
 <optgroup label="C48 Document"><OPTION value="2">C48 Referral <OPTION value="3">C48 Discharge</optgroup></SELECT>

<div id="textarea">
      <label>Select a C32 record to import</label><br/>
      <%= f.file_field  :uploaded_data, :id => "new_record"%><br/><br/>
      <%= submit_tag 'Import' %>
    <% end -%>
</div>
</form>

我做错了什么。还有一个页面加载我想在页面刷新时隐藏div同样的东西。