show hide jquery的问题

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

       $(document).ready(function(){ $('#content1').hide(); $('a').click(function(){ $('#content1').show('slow'); }); $('a#close').click(function(){ $('#content1').hide('slow'); }) });   body{font-size:12px; font-family:"Trebuchet MS"; background: #CCF} #content1{ border:1px solid #DDDDDD; padding:10px; margin-top:5px; width:300px; }    Test 1 
 
 
Hide 1
 
 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.
 
Close
 
 
 Test 2 
 
 
Hide 2
 
 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.
 
Close
 
 
   

Answer 1

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

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

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

Answer 2

这个块：

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

说任何时候单击任何锚点，显示ID为content1的元素。 然后，您可以定义ID为“close”的锚点，您可以定义一个关闭元素的处理程序。 这会导致冲突，因为它也是一个锚点。 由于close元素是ID为“close”的锚点，您希望它做什么？ 调用show（），因为它是一个锚或调用hide（），因为它的ID为“close”？

Answer 3

您需要将其他答案加上更多的组合，更改标记以使用类而不是重复ID，如下所示：

 Test 2 
 
 
Hide 1
 
 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.
 
Close
 
  

并调整您的单击处理程序以对类进行操作并且是相对的 ，如下所示：

 $('a.click').click(function(){ $(this).next('.box').children('.content').show('slow'); }); $('a.close').click(function(){ $(this).closest('.content').hide('slow'); }); 

这些单击处理程序不再指向单个ID或类，而是相对于当前链接对类进行操作。 .click锚使用.next()和.children()打开以下.content div，并且.close链接使用.closest()隐藏.content div，所有相对。