show hide jquery的问题

我试图让show hide在多个对象上工作,但我无法让它工作.任何帮助将是一个很好的非常感谢…我迷失了如何做到这一点.如果我只做一个秀隐藏它工作正常但不止一个它不能正常工作.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0        Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Show Hide Sample</title>
<script src="js/jquery.js" type="text/javascript"></script>

<script type="text/javascript">
  $(document).ready(function(){
  $('#content1').hide();
  $('a').click(function(){
 $('#content1').show('slow');

});

 $('a#close').click(function(){
        $('#content1').hide('slow');
})

});
</script>

    <style>
body{font-size:12px; font-family:"Trebuchet MS"; background: #CCF}
#content1{
border:1px solid #ddddDD;
padding:10px;
margin-top:5px;
width:300px;
}
</style>

</head>

<body>

<a href="#" id="click">Test 1</a>
<div class="Box">
<div id="content1">
<h1 align="center">Hide 1</h1>

<P> Lorem ipsum dolor sit amet,consectetuer adipiscing elit. Nullam pulvinar,enim ac hendrerit mattis,lorem mauris vestibulum tellus,nec porttitor diam nunc tempor dui. Aenean orci. Sed tempor diam eget tortor. Maecenas quis lorem. Nullam semper. Fusce adipiscing tellus non enim volutpat malesuada. Cras urna. Vivamus massa metus,tempus et,fermentum et,aliquet accumsan,lectus. Maecenas iaculis elit eget ipsum cursus lacinia. Mauris pulvinar.</p>




<p><a href="#" id="close">Close</a></p>
</div>
</div>


<a href="#" id="click">Test 2</a>
<div class="Box">
<div id="content1">
<h1 align="center">Hide 2</h1>
   <p> Lorem ipsum dolor sit amet,lectus. Maecenas iaculis elit eget ipsum cursus lacinia. Mauris pulvinar.</p>

<p><a href="#" id="close">Close</a></p>
</div>
</div>


</body>
</html>

解决方法

您正在为关闭锚点使用重复的ID.请改用类.close并修改您的选择器,如下所示：

$('a.close').click(function(){
     $('#content1').hide('slow');
 });

 <a href="#" class="close">Close</a>

…并且不要使用重复的ID.

show hide jquery的问题

解决方法

相关文章