我用jquery做了一个切换按钮。我打开那个页面，首先我看到所有内容都可见。当我点击按钮然后它隐藏。我想先隐藏，然后点击按钮然后显示。
第一张图片是点击之前 第二个是点击后
HTML
<button id="pak">Asia</button>
<div class="asia">
<ul>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/aisa.html"> <font size="4">List of cities in Asia</font></a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/shag.html"> Shanghai</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/toky.html"> Tokyo</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/kara.html"> Karachi</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/dehl.html"> Dehli</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/mumb.html"> Mumbai</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/beij.html"> Beijing</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/seou.html"> Seoul</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/hong.html"> Hong Kong</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/gaun.html"> Gaungzhou</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/uzbe.html"> Uzbekestian</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tehr.html"> Tehran</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/laho.html"> Lahore</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/riya.html"> Riyadh</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jedd.html"> Jeddah</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jakt.html"> Jaktara</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/osak.html"> Osaka</a></li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tian.html"> Tianjin</a></li>
</ul>
</div>
的Javascript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#pak").click(function(){
$(".asia").toggle(700);
});
});
</script>
有人可以帮忙吗？
答案 0 :(得分：1)
将样式display:none添加到元素或类中，它将隐藏页面加载元素
$(document).ready(function() {
$("#pak").click(function() {
$(".asia").toggle(700);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="pak">Asia</button>
<div class="asia" style="display:none">
<ul>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/aisa.html"> <font size="4">List of cities in Asia</font></a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/shag.html"> Shanghai</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/toky.html"> Tokyo</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/kara.html"> Karachi</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/dehl.html"> Dehli</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/mumb.html"> Mumbai</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/beij.html"> Beijing</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/seou.html"> Seoul</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/hong.html"> Hong Kong</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/gaun.html"> Gaungzhou</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/uzbe.html"> Uzbekestian</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tehr.html"> Tehran</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/laho.html"> Lahore</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/riya.html"> Riyadh</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jedd.html"> Jeddah</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jakt.html"> Jaktara</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/osak.html"> Osaka</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tian.html"> Tianjin</a>
</li>
</ul>
</div>
答案 1 :(得分：0)
您可以使用简单的CSS规则隐藏它们。
CSS推荐
.asia{
display:none;
}
或者，使用jQuery隐藏它们
$(document).ready(function(){
$(".asia").hide();
$("#pak").click(function(){
$(".asia").toggle(700);
});
});
$(document).ready(function() {
$("#pak").click(function() {
$(".asia").toggle(700);
});
});.asia {
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="pak">Asia</button>
<div class="asia">
<ul>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/aisa.html"> <font size="4">List of cities in Asia</font></a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/shag.html"> Shanghai</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/toky.html"> Tokyo</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/kara.html"> Karachi</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/dehl.html"> Dehli</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/mumb.html"> Mumbai</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/beij.html"> Beijing</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/seou.html"> Seoul</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/hong.html"> Hong Kong</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/gaun.html"> Gaungzhou</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/uzbe.html"> Uzbekestian</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tehr.html"> Tehran</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/laho.html"> Lahore</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/riya.html"> Riyadh</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jedd.html"> Jeddah</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/jakt.html"> Jaktara</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/osak.html"> Osaka</a>
</li>
<li><a href="file:///C:/Documents%20and%20Settings/maheer/Desktop/cities/tian.html"> Tianjin</a>
</li>
</ul>
</div>