为什么我的下拉按钮触发Uncaught Reference Error: DropDown not defined报错

错误原因及修复方案 #

你遇到的DropDown未定义报错由以下几个问题共同导致，按优先级修复即可：

• JS文件未被浏览器正常加载
  你HTML里引入JS的标签type属性写错了，错误写法：

  <script type="javascript" src="Java/Java.js"></script>
  

  正确的type值为text/javascript，也可以直接省略type属性（HTML5标准下默认就是javascript），修改为：

  <script src="Java/Java.js"></script>
  

• 点击事件写法错误
  你绑定点击事件时只写了函数名，没有加执行括号，错误写法：

  <a onclick="DropDown" class="dropbtn">MORE</a>
  

  修改为：

  <a onclick="DropDown()" class="dropbtn">MORE</a>
  

• HTML结构不规范
  1. <header>标签不能放在<head>和<body>中间，要移动到<body>标签内部
  2. MORE按钮的a标签嵌套错误，你在a标签内部放了下拉菜单的div，还多写了一个多余的</a>闭合标签，会导致DOM解析异常，修正后的导航li结构如下：

  <li>
    <a onclick="DropDown()" class="dropbtn">MORE</a>
    <div id="myDropdown" class="dropdown-content">
      <a href="#">Profile</a>
      <a href="#">Settings</a>
      <a href="#">Log Out</a>
    </div>
  </li>
  

内容的提问来源于stack exchange，提问作者MINDLESS PARADOX