为什么只有一个paragragh隐藏和显示而不是全部? [英] Why is only one paragragh hiding and showing and not all?

查看:88
本文介绍了为什么只有一个paragragh隐藏和显示而不是全部?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个我正在研究的HTML网站,我在某个部分使用jQuery。我创建了一个隐藏和显示功能,但只能隐藏和显示第一段,而不能同时显示所有。我在jQuery代码或HTML代码中遗漏了什么吗?



这是HTML代码:



I have a HTML site I am working on and I am using jQuery on a certain part. I have created a Hide and Show function but can only get the first paragraph to hide and show and not all at the same time. Did I miss something within the jQuery code or HTML code?

Here is the HTML code:

<!DOCTYPE html>

<html lang="en">

<head>
	<title>Path of Light Yoga Studio :: Classes</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	<script src="yoga.js"></script>
</head>
<body>
	<div id="wrapper">
	<header><h1>Path of Light Yoga Studio</h1></header>
		<p></p>
			<a href="index.html">Home</a>  
			<a href="Classes.html">Classes</a> 
			<a href="Schedule.html">Schedule</a> 
			<a href="Contact.html">Contact</a>
			<a href="Store.html">Store</a>
		<p></p>
	
		<p></p><div id="hero"></div><p></p>
		<br>
	<button id="hide">Hide</button>
	<button id="show">Show</button>

			<h2>Yoga Classes</h2>
		<br>
		<dl>
			<dt>Gentle Hatha Yoga</dt>
			<dd><div id="p">Intended for beginners and anyone wishing a grounded foundation in the practice of yoga, 
				this 60 minute class of poses and slow movement focuses on asana(proper alignment and posture),
				pranayama (breath work), and guided meditation to foster your mind and body connection.<p></p></div></dd>
			<br>
			<dt>Vinyasa Yoga</dt>
			<dd><div id="p">Although designed for intermediate to advanced students, geginners are welcome to sampe this 60 minute class 
				that focuses on breath-synchronized movement -- you will inhale and exhale as you flow energetically through 
				yoga poses.<p></p></div></dd>	
			<br>
			<dt>Restorative Yoga</dt>
			<dd><div id="p">This 90 minute class features very slow movement and long poses that are supported by a chair or wall. This calming, 
				restorative experience is suitable for students of any level of experience.
				This practice can be a perfect way to help rehabilitate an injury.<p></p></div></dd>
			
		</dl>

	

        Copyright 2016 © Path of Light Yoga<br>
        <a>khopkin5@my.westga.edu</a>

</div>
</body>





这是我的jQuery代码:





Here is my jQuery code:

$(document).ready(function(){
    $("#hide").click(function(){
        $("#p").hide();
    });
    $("#show").click(function(){
        $("#p").show();
    });
});

Please Help!





我的尝试:



我尝试过不同的jQuery函数和切换函数。我知道切换功能不再起作用。



What I have tried:

I have tried different jQuery functions and toggle function. I know that the toggle function doesn't work any more.

推荐答案

document )。ready( function (){
(document).ready(function(){


#hide)。click( function (){
("#hide").click(function(){


#p)。hide();
});
("#p").hide(); });


这篇关于为什么只有一个paragragh隐藏和显示而不是全部?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆