当点击div时,我想要显示不同的div.
因此,当“#music”被点击时,我想要显示“#musicinfo”.
这是css：
#music {
float:left;
height:25px;
margin-left:25px;
margin-top:25px;
margin-right:80px;
font-family: "p22-underground",sans-serif;
font-style: normal;
font-weight: 500;
font-size:13pt;
}
#musicinfo {
width:380px;
margin:25px;
font-family: "p22-underground",sans-serif;
font-style: normal;
font-weight: 500;
font-size:13pt;
line-height:1.1;
display:none;
}
和jquery：
<script type="text/javascript">
$("#music").click(function () {
$("#musicinfo").show("slow");
});
</script>
任何帮助将是伟大的:)
解决方法
您遇到的问题是事件处理程序在元素存在于DOM中之前被绑定,如果将jQuery包含在$(document).ready()中,那么它应该工作得很好：
$(document).ready(
function(){
$("#music").click(function () {
$("#musicinfo").show("slow");
});
});
另一种方法是放置< script>< / script>在页面的脚下,所以在DOM被加载并准备好之后就遇到了.
为了使div隐藏起来,一旦点击了#music元素,只需使用toggle()：
$(document).ready(
function(){
$("#music").click(function () {
$("#musicinfo").toggle();
});
});
而为了褪色：
$(document).ready(
function(){
$("#music").click(function () {
$("#musicinfo").fadeToggle();
});
});
