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).ready(function)(){
    $("#tissueState").hide();
    $('#library_type').change(function(){
      var value = $(this).val();
    });
  });

隐藏JQuery无法正常工作

2 个答案: