hide()是jQuery中的一種內置方法,用於隱藏所選元素。
用法:
$(selector).hide(duration, easing, call_function);
選擇器是選定的元素。
參數:它接受以下指定的三個參數:
- duration:它指定隱藏效果的速度。
- easing:它指定元素在動畫的不同點的速度。
- call_function:這是隱藏操作後要執行的回調函數。
返回值:它不返回任何值。
代碼1:
在下麵的代碼中,沒有參數用於傳遞給此方法。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- jQuery code to show the working of this method -->
<script>
$(document).ready(function() {
$(".b1").click(function() {
$("p").hide();
});
});
</script>
<style>
div {
width: 50%;
height: 80px;
padding: 20px;
margin: 10px;
border: 2px solid green;
font-size: 30px;
}
.b1 {
margin: 10px;
}
</style>
</head>
<body>
<div>
<p>GeeksforGeeks !.</p>
</div>
<!-- click on this button and above paragraph will disappear -->
<button class="b1">Click me !</button>
</body>
</html>
輸出:
在點擊“點擊我!”按鈕之前,
點擊“點擊我!”按鈕後,
代碼2:
在下麵的代碼中,參數傳遞給此方法。
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
<!-- jQuery code to show the working of this method -->
$(document).ready(function() {
$(".btn1").click(function() {
$("p").hide(1000, function() {
alert("Hide() method has finished its working!");
});
});
});
</script>
<style>
p {
width: 40%;
padding: 20px;
height: 50px;
border: 2px solid green;
}
</style>
</head>
<body>
<p>GeeksforGeeks.!</p>
<!-- click on this button and above paragraph will hide -->
<button class="btn1">Click to Hide</button>
</body>
</html>
輸出:
在單擊“Click to Hide”按鈕之前,
單擊“Click to Hide”按鈕後,
相關用法
- JQuery after()用法及代碼示例
- JQuery one()用法及代碼示例
- JQuery has()用法及代碼示例
- JQuery on()用法及代碼示例
- JQuery eq()用法及代碼示例
- JQuery val()用法及代碼示例
- JQuery last()用法及代碼示例
- JQuery first()用法及代碼示例
- JQuery children()用法及代碼示例
- JQuery hasClass()用法及代碼示例
- JQuery slideUp()用法及代碼示例
注:本文由純淨天空篩選整理自kundankumarjha大神的英文原創作品 jQuery | hide() with Examples。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。