溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了“jquery如何實現點擊顯示元素再次點擊隱藏元素”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“jquery如何實現點擊顯示元素再次點擊隱藏元素”吧！
方法：1、用click()方法給按鈕綁定點擊事件并指定處理函數；2、在函數中用if語句、show()和hide()實現，語法“if(元素對象.is(':hidden')){元素對象.show();}else{元素對象.hide();}”。
本教程操作環境：windows7系統、jquery1.10.0版本、Dell G3電腦。
jquery怎樣實現點擊顯示元素再次點擊隱藏元素
在jquery中，可以通過show()方法和hide()方法來實現點擊按鈕顯示再次點擊隱藏，hide()方法如果被選的元素已被顯示，則隱藏該元素。語法為：
$(selector).hide(speed,callback)
show()方法如果被選元素已被隱藏，則顯示這些元素，語法為：
$(selector).show(speed,callback)
下面我們通過示例來看一下怎樣實現縣級顯示再次點擊隱藏，示例如下：
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head>
<body>
<style type="text/css">
div{width:100px;
height:100px;
background: red;
}
</style>
<div id="test"></div>
<button id="anniu">顯示與隱藏</button>
<script>
$(function(){
$('#anniu').click(function(){//點擊按鈕
if($('#test').is(':hidden')){//如果當前隱藏
$('#test').show();//點擊顯示
}else{//否則
$('#test').hide();//點擊隱藏
}
})
})
</script>
</body>
</html>輸出結果：
感謝各位的閱讀，以上就是“jquery如何實現點擊顯示元素再次點擊隱藏元素”的內容了，經過本文的學習后，相信大家對jquery如何實現點擊顯示元素再次點擊隱藏元素這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
