微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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.

原文地址:https://www.jb51.cc/jquery/179094.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐