我正在使用 onclick 函数在我的移动网站上下拉一个简单的列表,但它不起作用 - 代码如下。奇怪的是,我旁边还有其他格式完全相同的东西,而且效果很好(当然,所有名称都不同)。
显然“show3”类没有被切换,因为我可以更改“display: none;”到 .incoming-listc 中的“display: block”,它显示得很好。但是,当我单击“传入”范围时,没有任何反应!
HTML:
<div class="mobile-incoming">
<span onclick="myFunction3()">Incoming <i class="fa fa-angle-down"></i></span>
<div id="incoming-list" class="incoming-listc">
Updated 5.4.16<br>Goodall RCJ EIR/Adirondack<br>2008 Martin 000-18 Authentic
</div>
</div>
<script>
function myFunction3() {
document.getElementById("incoming-list").classList.toggle("show3");
}
</script>
CSS:
.mobile-incoming {
position: fixed;
top: 0;
right: 60px;
cursor: pointer;
text-align: right;
line-height: 44px;
font-family: "Helvetica Neue", Verdana;
font-size: 0.8em;
font-weight: 200;
color: white;
}
.incoming-listc {
display: none;
position: fixed;
top: 45px;
right: 0;
left: 0;
background: rgba(70, 70, 70, 0.9);
border-bottom: 1px solid white;
}
.show3 {
display: block;
}
最佳答案
好的,明白了。以防万一以后有人发现它有类似的问题。实际上,我的 CSS 在样式表中的顺序与我粘贴给你们的顺序不同。一旦我将“show3”类放在其他两个类之后,它就神奇地开始工作了。不知道类(class)顺序很重要!
关于javascript - Onclick 函数在 <span> 中不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37038319/