使元素消失和出现!惊吓你的敌人,迷惑你的朋友。
简介
show() 和 hide() 这两个jQuery函数分别让元素出现和消失。
默认代码
<!-- JavaScript可以用来显示和隐藏元素! --><script> var showButton = $("#showButton"); // 创建变量'hideButton'来存储#hideButton
var image = $("#image"); function showElement() { image.show(); } function hideElement() { // 在图像变量上使用“hide()”函数:
} showButton.on("click", showElement); // 添加一个事件监听器到hideButton变量。 // 当“点击”发生时,它应该执行HielEng:
</script> <style> body { text-align:center; } button { width:25%; height:64px; } img { width:50%; } </style> <button id="showButton">显示</button> <button id="hideButton">隐藏</button> <br> <img id="image" src="http://direct.codecombat.com/file/db/thang.type /57586f0a22179b2800efda37/portrait.png"/>
概览
#隐藏并显示
在元素上调用 hide() 会使元素从屏幕上消失!
与此相反, show() 则会让元素按照隐藏前的样子重新出现。 (除非在隐藏时进行过更改!)
挂接到 "click" 事件则可以为需要的隐藏和显示行为编写强大的脚本!
消失活动 解法
<!-- JavaScript可以用来显示和隐藏元素! --><script> var showButton = $("#showButton"); // 创建变量'hideButton'来存储#hideButton var hideButton = $("#hideButton"); var image = $("#image"); function showElement() { image.show(); } function hideElement() { // 在图像变量上使用“hide()”函数: image.hide() } showButton.on("click", showElement); // 添加一个事件监听器到hideButton变量。 // 当“点击”发生时,它应该执行HielEng: hideButton.on("click", hideElement); </script> <style> body { text-align:center; } button { width:25%; height:64px; } img { width:50%; } </style> <button id="showButton">显示</button> <button id="hideButton">隐藏</button> <br> <img id="image" src="http://direct.codecombat.com/file/db/thang.type /57586f0a22179b2800efda37/portrait.png"/>
本攻略发于极客战记官方教学栏目,原文地址为:
https://codecombat.163.com/news/jikezhanji-xiaoshihuodong