【发布时间】:2015-03-22 01:47:51
【问题描述】:
我有链接,一旦点击它会取消隐藏内容,然后再次点击后所有内容都会显示。我在谷歌文档上使用它,它不起作用。我也在使用 CSS 。链接显示,但 javascript 和 CSS 不会为我或其他人编译。
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "Musis List";
}
else {
ele.style.display = "block";
text.innerHTML = "Musis List ▼";
}
}
#title a:link { color: #38761D; text-decoration: none !important; }
#title a:visited {
color: #38761D; text-decoration: none !important;
}
#title a:hover{
color: #4EA628;
background-color:transparent;
text-decoration: none !important;
}
#title a:active {
color: #4EA628; text-decoration: none !important;
}
#title a {
text-decoration: none !important;
display:block;
border-bottom: 0px solid #38761D;
font-family: Verdana, sans-serif;
font-weight: bold;
font-size: large;
line-height: 1.26;
}
<center>
<div id="title" >
<a id="displayText" href="javascript:toggle();">Musis List</a>
</div>
<div id="toggleText" style="display: none">
Here will be a list of music....
</div>
<br />
<br />
<br />
<script language="javascript">
function toggle1(id) {
var ele = document.getElementById("toggleText1");
var text = document.getElementById("displayText1");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "Video List";
}
else {
ele.style.display = "block";
text.innerHTML = "Video List ▼";
}
}
</script>
<div id="title" >
<a id="displayText1" href="javascript:toggle1(1);">Video List</a>
</div>
<div id="toggleText1" style="display: none">Here will be a list of videos....</div>
</center>
如果有人可以提供帮助,请告诉我。我很感激队友。
【问题讨论】:
标签: javascript html css show-hide google-sites