首頁 > web前端 > 前端問答 > jquery怎麼隱藏textarea

jquery怎麼隱藏textarea

青灯夜游
發布: 2022-04-22 11:41:18
原創
2486 人瀏覽過

方法:1、用hide(),語法「$("textarea").hide()」;2、用slideUp(),語法「$("textarea").slideUp()」; 3.用fadeOut(),語法「$("textarea").fadeOut()」。

jquery怎麼隱藏textarea

本教學操作環境:windows7系統、jquery1.10.2版本、Dell G3電腦。

文字區域中可容納無限數量的文本,其中的文本的預設字體是等寬字體(通常是 Courier)。

jquery隱藏textarea的方法

方法1:使用hide()

hide( ) 方法可以隱藏被選元素。被隱藏的元素不會被完全顯示(不再影響頁面的佈局)。

此方法的效果與 CSS 屬性 display:none 類似。

範例:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function() {
				$("button").click(function() {
					$("textarea").hide();
				})
			})
		</script>
	</head>
	<body>
		<textarea rows="10" cols="30">我是一个文本框。</textarea>
		<br><button>隐藏textarea</button>
	</body>
</html>
登入後複製

jquery怎麼隱藏textarea

方法2:使用slideUp()

slideUp() 方法以滑動方式隱藏被選元素。被隱藏的元素不會被完全顯示(不再影響頁面的佈局)。

範例:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function() {
				$("button").click(function() {
					$("textarea").slideUp();
				})
			})
		</script>
	</head>
	<body>
		<textarea rows="10" cols="30">我是一个文本框。</textarea>
		<br><button>隐藏textarea</button>
	</body>
</html>
登入後複製

jquery怎麼隱藏textarea

#方法3:使用fadeOut()

fadeOut() 方法逐漸改變被選元素的不透明度,從可見到隱藏(褪色效果)。

範例:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function() {
				$("button").click(function() {
					$("textarea").fadeOut();
				})
			})
		</script>
	</head>
	<body>
		<textarea rows="10" cols="30">我是一个文本框。</textarea>
		<br><button>隐藏textarea</button>
	</body>
</html>
登入後複製

jquery怎麼隱藏textarea

【推薦學習:jQuery影片教學web前端影片

以上是jquery怎麼隱藏textarea的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板