javascript - 简单的onclick应用于<a>不能正常运行IE和FF

我有一个简单的列表，如下所示：

<div class="settingButton"><a href="#"></a>
     <div class="subManu">
           <ul>
               <li><a onclick="alert('clicked!!')" href="#">Default Categories</a></li>
               <li><a onclick="alert('clicked!!')" href="#">Wizard</a></li>
                <div class="clear"></div>
            </ul>
            <div class="clear"></div>
      </div>
</div>

单击链接后看不到警报！它在Chrome中可以正常运行，但在IE和FF中则不能。我使用了相同的结构而不分配类，并且按预期工作。也许问题出在CSS，但我不确定是什么。这是下拉菜单的CSS，

.settingButton {
   background:url(/mobiledoc/jsp/dashboard/images/settings.png) 0 0 no-repeat;
   width:25px;
   height:37px;
   float:left;
   position:absolute;
   right:13px;
   top:-30px;
}
.settingButton a {
   display:block;
   width:25px;
   height:37px;
}
.settingButton:hover {
   background:url(/mobiledoc/jsp/dashboard/images/settingsHover.png) 0 0 no-repeat;
}
.settingButton:active {
   background:url(/mobiledoc/jsp/dashboard/images/settingsActive.png) 0 0 no-repeat;
}
.settingButton div.subManu {
   display:none;
   height:100px;
}
.settingButton:hover div.subManu {
   background:url(/mobiledoc/jsp/dashboard/images/subNavArrow.png) no-repeat right 3px;
   position:absolute;
   top:20px;
   z-index:99;
   right:0;
   width:250px;
   height:50px;
   display:block;
   padding:13px 0 0 0;
}
div.subManu ul {
   display:block;
   background:url(/mobiledoc/jsp/dashboard/images/dropDownMidBg.png) repeat-x;
   border-left:#547b9a 1px solid;
   border-right:#547b9a 1px solid;
   height:29px;
   padding:0 0 0 7px;
}
div.subManu ul li {
   width:110px;
   float:left;
   margin:0 5px;
   display:block;
   height:29px;
}
div.subManu ul li a {
   display:inline;
   color:#ffffff;
   font-family:Arial, Helvetica, sans-serif;
   font-size:12px;
   font-weight:normal;
   line-height:28px;
}
div.subManu ul li a:hover {
   color:#b7f630;
}
div.subManu ul li.active-manu a {
   color:#b7f630;
}

我遇到了另一个问题，但没有找到任何相关的答案。让我知道您是否需要更多信息。

谢谢！

最佳答案

如果您不希望使用链接，请不要使用A元素，而应使用按钮或样式化跨度，例如

<style type="text/css">
  .clickable:hover {
    text-decoration: underline;
    cursor: pointer;
  }
 </style>
 ...
 <span class="clickable">thing to click</span>

无论如何，链接的首选方法是：

<a href="http://link for script-disabled browsers"
   onclick="myFunction(); return false;">...</a>

关于javascript - 简单的onclick应用于<a>不能正常运行IE和FF，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11465417/