使用jquery显示/隐藏

我无法隐藏和显示p标记。有人可以帮我解决这个问题。我在尝试完成的是，当您单击隐藏按钮时，内容被隐藏。然后，当您准备好显示内容时，请点击显示按钮。我知道你可以使用切换，但我不想这样做，使用jquery显示/隐藏

<!DOCTYPE html> <!DOCTYPE html> 
<html> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
</script> 
<script> 
$(document).ready(function(value){ 
    $("button").click(function(value){ 
    if (value==="hide"){ 
     $("p").hide();} 
    else 
      $("p").show(); 
    }); 
}); 
</script> 
</head> 

<body> 
<h2>This is a heading</h2> 
<p>This is a paragraph.</p> 
<p>This is another paragraph.</p> 
<button value="hide">Hide me</button> 
<button value="show">Show me</button> 
</body> 
</html> 
<html> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
</script> 
<script> 
$(document).ready(function(value){ 
    $("button").click(function(value){ 
    if (value==="hide"){ 
     $("p").hide();} 
    else 
      $("p").show(); 
    }); 
}); 
</script> 
</head> 

<body> 
<h2>This is a heading</h2> 
<p>This is a paragraph.</p> 
<p>This is another paragraph.</p> 
<button value="hide">Hide me</button> 
<button value="show">Show me</button> 
</body> 
</html>

来源

2010-12-09 user244394

你不能有多个` ID的同名。改为使用`class` es。 – 2010-12-09 20:55:29

@patrick - 非唯一ID是无效的HTML标记。 – 2010-12-09 20:58:02

目前，它不与多个内容合作。

这是因为您的页面上有重复的ID。为了解决这个问题，用类，并从点击的锚锁定下.slickbox格：

$('a.slick-toggle').click(function() { 
    $(this).next("div").find(".slickbox").toggle(400); 
    return false; 
});

..和更改ID，以类，如：

<a class="slick-toggle" href="#">Toggle the box</a> 
<div style="position:relative; outline: 1px dashed orange; padding:100px;"> 
    <div class="slickbox" style=" outline: 1px dashed hotpink; background-color:#ccc;position:absolute; top:100px; left: 20px;"> 
     <h2> music nsme</h2> 
     <p>This is the box that will be shown and hidden and togg </p> 
    </div> 
</div>

来源

2010-12-09 20:53:16 karim79

使用jquery显示/隐藏

回答

相关问题