隐藏JQuery不工作

Question

我试图做一个下拉(B)菜单，这是隐藏在最初和当一个不同的形式(A)完成，然后这个下拉(B)菜单显示。但是，当页面加载时，第二个下拉菜单(B)不会被隐藏.代码如下，并存储在php文件中。

<h4>And What Type of Data Are You Focusing On?</h4>
    <select name="library_type" id="library_type">
      <option value="DNA"> DNA </option>
      <option value = "RNA"> RNA </option>
      <option value="WGS"> Whole Genome Sequences</option>
      <option value="WXS">Whole Exome Sequences</option>
      <option value="RNA-Seq">RNA-Seq</option>
      <option value = "miRNA-Seq">miRNA-Seq</option>
      <option value = "VALIDATION">VALIDATION</option>
      <option value = "AMPLICON">AMPLICON</option>
      <option value = "ChIP-Seq">ChIP-Seq</option>
      <option value = "Bisulfite-Seq">Bisulfite-Seq</option>
      <option value = "TARGET_60">TARGET_60</option>
      <option value = "TARGET_50">TARGET_50</option>
      <option value = "TARGET_61">TARGET_61</option>
      <option value = "OTHER">OTHER</option>
    </select>
<h4> What Condition are You Interested in? </h4>
    <select name="tissueState" id="tissueState">
      <option value = "Normal"> Normal </option>
      <option value = "Tumor"> Tumor </option>
      <option value = "Both"> Both </option>
    </select>

  <br><br>
  <input type="submit" value="Show me Matches">
</form></center>

在一个单独的文件hideDropDownMenu.js中，这是该文件的内容。

  $("#tissueState").hide();

  $(document).ready(function)(){
    $('#library_type').change(function(){
      var value = $(this).val();
    });
  });

在.php文件的头上，我有以下内容

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>  
<script src="hideDropDownMenu.js"></script>

以下是页面的外观

​

Answer 1

你的代码有问题..。

首先，正确关闭文档准备和更改事件。

从这个}到这个});和这个$(document).ready(function)(){必须在$(document).ready(function(){中改变

这是修正后的代码：

<script>
  $("#tissueState").hide();

  $(document).ready(function(){
    $('#library_type').change(function(){
      var value = $(this).val();
    });
  });
</script>

试一试：https://jsfiddle.net/ougvw8kk/

Answer 2

为了在页面加载期间隐藏下拉列表，您需要在document函数中声明hide语句。

  $(document).ready(function)(){
    $("#tissueState").hide();
    $('#library_type').change(function(){
      var value = $(this).val();
    });
  });