javascript - 我添加了这段代码,但现在子 <li> 菜单列表未打开..执行了操作但未打开菜单

标签 javascript php html css

我发布的这段代码是图像、Html 和 css 代码。当我单击复选框图像但未打开子时 <li> . 如果我这样写代码。

$("#menu1 li a").click(function(){$(this).next("ul").toggle(); });

但是子<li>打开速度非常快。有人告诉我吗?? 在此图像中,可以看到它的代码外观。 enter image description here

<script>
 $("#menu1 li a").click(function(){ 	
$(this).next("ul").toggle("slow"); }); 
$("#menu2 li a").click(function(){ 	
$(this).next("ul").toggle("slow"); }); 
</script>
#leftcolsearch {
	float: left;
	width: 210px;
	margin: 0 7px 10px 0;
}
#leftcolsearch .option {
	float: left;
	width: 196px;
	border: #CCCCCC dotted 1px;
	border-top: none;
	padding: 1px 0 10px 10px;
}
.menu {
	margin: 0;
	padding: 0 0 0 2px;
}

.menu li {list-style: none; float:left; width:185px; margin:0;}
.menu li ul{ margin:0; padding:0; margin-left:8px; display:none; }
.menu li ul li{
margin:4px 0;
padding: 0;
line-height: 100%;
display: inline;
}
.menu a {
	color: #999;
	background: url(../images/checkbox.png) no-repeat left top;
	padding: 0 0 0 15px;
	text-decoration: none;
	outline: none;
}
.menu li a.active,.menu li a:hover{
	color: #539dbc;
background: url(../images/checkboxwc.png) no-repeat left top; display:block;	
	padding: 0 0 0 15px;
}
<div id="leftcolsearch"> 
  <div class="option">
    <h4 style="margin-left:7">Date:</h4>
    <ul class="menu" id="menu1">
      <li><a href="">2013</a>
        <ul>
          <li><a href="">November</a></li>
          <li><a href="">December</a></li>
        </ul>
      </li>
      <li><a href="">2014</a>
        <ul>
          <li><a href="">January</a></li>
          <li><a href="">February</a></li>
          <li><a href="">March</a></li>
          <li><a href="">April</a></li>
          <li><a href="">May</a></li>
          <li><a href="">June</a></li>
          <li><a href="">July</a></li>
          <li><a href="">August</a></li>
          <li><a href="">September</a></li>
          <li><a href="">October</a></li>
          <li><a href="">November</a></li>
          <li><a href="">December</a></li>
        </ul>
      </li>
    </ul>
  </div>

<div class="option">
    <h4>Location</h4>
    <ul class="menu" id="menu2">
      <li><a href="">Africa</a>
        <ul>
          <li><a href="">Algeria</a></li>
          <li><a href=""> Angola</a></li>
          <li><a href=""> Cameroon</a></li>
          <li><a href=""> Egypt</a></li>
          <li><a href=""> Kenya</a></li>
          <li><a href=""> Madagascar</a></li>
          <li><a href=""> Morocco</a></li>
          <li><a href=""> Mozambique</a></li>
          <li><a href=""> Nigeria</a></li>
          <li><a href=""> South Africa</a></li>
          <li><a href=""> Tanzania, United Republic Of</a></li>
        </ul>
      </li>
      <li> <a href="">Asia</a>
        <ul>
          <li><a href="">Bahrain</a></li>
          <li><a href=""> Bangladesh</a></li>
          <li><a href=""> Canada</a></li>
          <li><a href=""> China</a></li>
          <li><a href=""> France</a></li>
          <li><a href=""> Hong Kong</a></li>
          <li><a href=""> India</a></li>
          <li><a href=""> Indonesia</a></li>
          <li><a href=""> Iran, Islamic Republic Of</a></li>
          <li><a href=""> Israel</a></li>
          <li><a href=""> Japan</a></li>
          <li><a href=""> Jordan</a></li>
          <li><a href=""> Kazakhstan</a></li>
          <li><a href=""> Korea, Republic Of</a></li>
          <li><a href=""> Lebanon</a></li>
          <li><a href=""> Macao</a></li>
          <li><a href=""> Malaysia</a></li>
          <li><a href=""> Oman</a></li>
          <li><a href=""> Pakistan</a></li>
          <li><a href=""> Philippines</a></li>
          <li><a href=""> Qatar</a></li>
          <li><a href=""> Saudi Arabia</a></li>
          <li><a href=""> Singapore</a></li>
          <li><a href=""> Sri Lanka</a></li>
          <li><a href=""> Taiwan, Province Of China</a></li>
          <li><a href=""> Thailand</a></li>
          <li><a href=""> Turkey</a></li>
          <li><a href=""> United Arab Emirates</a></li>
          <li><a href=""> Vietnam</a></li>
        </ul>
      </li>
      <li><a href=""> Australia</a>
        <ul>
          <li><a href="">Australia</a></li>
          <li><a href=""> Fiji</a></li>
          <li><a href=""> New Zealand</a></li>
        </ul>
      </li>
      <li> <a href="">Europe</a>
        <ul>
          <li><a href="">Austria</a></li>
          <li><a href=""> Belgium</a></li>
          <li><a href=""> Bulgaria</a></li>
          <li><a href=""> Croatia</a></li>
          <li><a href=""> Czech Republic</a></li>
          <li><a href=""> Denmark</a></li>
          <li><a href=""> Estonia</a></li>
          <li><a href=""> Finland</a></li>
          <li><a href=""> France</a></li>
          <li><a href=""> Germany</a></li>
          <li><a href=""> Greece</a></li>
          <li><a href=""> Hungary</a></li>
          <li><a href=""> Ireland</a></li>
          <li><a href=""> Italy</a></li>
          <li><a href=""> Lithuania</a></li>
          <li><a href=""> Monaco</a></li>
          <li><a href=""> Netherlands</a></li>
          <li><a href=""> Norway</a></li>
          <li><a href=""> Poland</a></li>
          <li><a href=""> Portugal</a></li>
          <li><a href=""> Romania</a></li>
          <li><a href=""> Russian Federation</a></li>
          <li><a href=""> Serbia</a></li>
          <li><a href=""> Slovakia</a></li>
          <li><a href=""> Slovenia</a></li>
          <li><a href=""> Spain</a></li>
          <li><a href=""> Sweden</a></li>
          <li><a href=""> Switzerland</a></li>
          <li><a href=""> Turkey</a></li>
          <li><a href=""> Ukraine</a></li>
          <li><a href=""> United Kingdom</a></li>
        </ul>
      </li>
      <li> <a href="">North America</a>
        <ul>
          <li><a href="">Canada
            Costa Rica</a></li>
          <li><a href=""> Cuba</a></li>
          <li><a href=""> Mexico</a></li>
          <li><a href=""> United States</a></li>
        </ul>
      </li>
      <li> <a href="">South America</a>
        <ul>
          <li><a href="">Argentina</a></li>
          <li><a href=""> Brazil</a></li>
          <li><a href=""> Chile</a></li>
          <li><a href=""> Colombia</a></li>
          <li><a href=""> Mexico</a></li>
          <li><a href=""> Peru</a></li>
          <li><a href=""> Uruguay</a></li>
        </ul>
      </li>
    </ul>
  </div>
  </div>

最佳答案

href 中的用户 javascript:void(0) 正在加载页面,javascript 没有问题,现在检查它...

<div id="leftcolsearch"> 
  <div class="option">
    <h4 style="margin-left:7">Date:</h4>
    <ul class="menu" id="menu1">
      <li><a href="javascript:void(0)">2013</a>
        <ul>
          <li><a href="">November</a></li>
          <li><a href="">December</a></li>
        </ul>
      </li>
      <li><a href="javascript:void(0)">2014</a>
        <ul>
          <li><a href="">January</a></li>
          <li><a href="">February</a></li>
          <li><a href="">March</a></li>
          <li><a href="">April</a></li>
          <li><a href="">May</a></li>
          <li><a href="">June</a></li>
          <li><a href="">July</a></li>
          <li><a href="">August</a></li>
          <li><a href="">September</a></li>
          <li><a href="">October</a></li>
          <li><a href="">November</a></li>
          <li><a href="">December</a></li>
        </ul>
      </li>
    </ul>
  </div>

<div class="option">
    <h4>Location</h4>
    <ul class="menu" id="menu2">
      <li><a href="javascript:void(0)">Africa</a>
        <ul>
          <li><a href="">Algeria</a></li>
          <li><a href=""> Angola</a></li>
          <li><a href=""> Cameroon</a></li>
          <li><a href=""> Egypt</a></li>
          <li><a href=""> Kenya</a></li>
          <li><a href=""> Madagascar</a></li>
          <li><a href=""> Morocco</a></li>
          <li><a href=""> Mozambique</a></li>
          <li><a href=""> Nigeria</a></li>
          <li><a href=""> South Africa</a></li>
          <li><a href=""> Tanzania, United Republic Of</a></li>
        </ul>
      </li>
      <li> <a href="javascript:void(0)">Asia</a>
        <ul>
          <li><a href="">Bahrain</a></li>
          <li><a href=""> Bangladesh</a></li>
          <li><a href=""> Canada</a></li>
          <li><a href=""> China</a></li>
          <li><a href=""> France</a></li>
          <li><a href=""> Hong Kong</a></li>
          <li><a href=""> India</a></li>
          <li><a href=""> Indonesia</a></li>
          <li><a href=""> Iran, Islamic Republic Of</a></li>
          <li><a href=""> Israel</a></li>
          <li><a href=""> Japan</a></li>
          <li><a href=""> Jordan</a></li>
          <li><a href=""> Kazakhstan</a></li>
          <li><a href=""> Korea, Republic Of</a></li>
          <li><a href=""> Lebanon</a></li>
          <li><a href=""> Macao</a></li>
          <li><a href=""> Malaysia</a></li>
          <li><a href=""> Oman</a></li>
          <li><a href=""> Pakistan</a></li>
          <li><a href=""> Philippines</a></li>
          <li><a href=""> Qatar</a></li>
          <li><a href=""> Saudi Arabia</a></li>
          <li><a href=""> Singapore</a></li>
          <li><a href=""> Sri Lanka</a></li>
          <li><a href=""> Taiwan, Province Of China</a></li>
          <li><a href=""> Thailand</a></li>
          <li><a href=""> Turkey</a></li>
          <li><a href=""> United Arab Emirates</a></li>
          <li><a href=""> Vietnam</a></li>
        </ul>
      </li>
      <li><a href="javascript:void(0)"> Australia</a>
        <ul>
          <li><a href="">Australia</a></li>
          <li><a href=""> Fiji</a></li>
          <li><a href=""> New Zealand</a></li>
        </ul>
      </li>
      <li> <a href="">Europe</a>
        <ul>
          <li><a href="">Austria</a></li>
          <li><a href=""> Belgium</a></li>
          <li><a href=""> Bulgaria</a></li>
          <li><a href=""> Croatia</a></li>
          <li><a href=""> Czech Republic</a></li>
          <li><a href=""> Denmark</a></li>
          <li><a href=""> Estonia</a></li>
          <li><a href=""> Finland</a></li>
          <li><a href=""> France</a></li>
          <li><a href=""> Germany</a></li>
          <li><a href=""> Greece</a></li>
          <li><a href=""> Hungary</a></li>
          <li><a href=""> Ireland</a></li>
          <li><a href=""> Italy</a></li>
          <li><a href=""> Lithuania</a></li>
          <li><a href=""> Monaco</a></li>
          <li><a href=""> Netherlands</a></li>
          <li><a href=""> Norway</a></li>
          <li><a href=""> Poland</a></li>
          <li><a href=""> Portugal</a></li>
          <li><a href=""> Romania</a></li>
          <li><a href=""> Russian Federation</a></li>
          <li><a href=""> Serbia</a></li>
          <li><a href=""> Slovakia</a></li>
          <li><a href=""> Slovenia</a></li>
          <li><a href=""> Spain</a></li>
          <li><a href=""> Sweden</a></li>
          <li><a href=""> Switzerland</a></li>
          <li><a href=""> Turkey</a></li>
          <li><a href=""> Ukraine</a></li>
          <li><a href=""> United Kingdom</a></li>
        </ul>
      </li>
      <li> <a href="javascript:void(0)">North America</a>
        <ul>
          <li><a href="">Canada
            Costa Rica</a></li>
          <li><a href=""> Cuba</a></li>
          <li><a href=""> Mexico</a></li>
          <li><a href=""> United States</a></li>
        </ul>
      </li>
      <li> <a href="">South America</a>
        <ul>
          <li><a href="">Argentina</a></li>
          <li><a href=""> Brazil</a></li>
          <li><a href=""> Chile</a></li>
          <li><a href=""> Colombia</a></li>
          <li><a href=""> Mexico</a></li>
          <li><a href=""> Peru</a></li>
          <li><a href=""> Uruguay</a></li>
        </ul>
      </li>
    </ul>
  </div>
  </div>

关于javascript - 我添加了这段代码,但现在子 <li> 菜单列表未打开..执行了操作但未打开菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30160761/

相关文章:

javascript - 预加载图像并具有缓冲区符号

多个域的PHP临时上传目录

php - MySQL和PHP搜索相似词

javascript - 选择下拉菜单时重置隐藏字段的值(Javascript)

javascript - 如何在 JavaScript 中逐行循环换行符分隔的 json?

javascript - 我需要在 jquery 中连接两个变量

javascript - 出现 "undefined is not a function"错误

javascript - PHP json格式编码

javascript - 如何从 ID 更改为 class?

javascript - Gif 图像未显示在 html 页面上