我在使用 jQuery 的“隐藏”功能时遇到问题。我只是使用死链接吗?我应该使用 2.1.1 吗? “警报”功能似乎有效,但隐藏功能无效。有什么想法我还应该做什么吗?
*{
margin: 0px;
padding: 0px;
}
#container{
width: 900px;
margin: 0px auto;
font-family: helvetica;
}
.effects{
}
.effects button, #content{
display: inline-block;
/*vertical-align: top;*/
}
button{
border: 2px solid grey;
border-radius: 5px;
padding: 5px;
margin: 50px 0 0 0;
position: relative;
vertical-align: center;
font-size: 18px;
font-weight: bold;
}
#content{
width: 700px;
}
#content h2, p{
display: block;
vertical-align: top;
width: 700px;
}
h2{
text-align: center;
width: 700px;
}
p{
width: 700px;
}
#border{
border-bottom: 4px solid black;
padding: 10px 0;
/*margin: 10px 0;*/
}
<!DOCTYPE>
<html>
<head>
<title>Help me with jQuery</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('h1').click(function(){
alert('hello');
})
$('#hide').click(function(){
$('p').hide();
})
})
</script>
</head>
<body>
<h1>YOOO</h1>
<div id="container">
<div class="effects">
<button div="hide">hide</button>
<div div="content">
<h2>hide</h2>
<p>Hide the matched elements.</p>
</div>
<div id="border"></div>
</div>
</div>
</body>
</html>
最佳答案
小错别字,您需要更正这一行:
<button div="hide">hide</button>
对此:
<button id="hide">hide</button>
已编辑
$(document).ready(function() {
$('h1').click(function() {
alert('hello');
})
$('#hide').click(function() {
$('p').hide();
})
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>YOOO</h1>
<div id="container">
<div class="effects">
<button id="hide">hide</button>
<div div="content">
<h2>hide</h2>
<p>Hide the matched elements.</p>
</div>
<div id="border"></div>
</div>
</div>
关于jQuery "hide"函数不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31347943/