.fadeOut() 方法动画匹配元素的不透明度。一旦不透明度达到 0，显示样式属性设置为无，因此元素不再影响页面的布局。如果上述情况属实，那么为什么我在恢复该段落时遇到问题？$("button").click(function() { if ($("#paragraph").css("display") == "none") { $("#paragraph").css("display") = "block"; $("#paragraph").css("opacity") = 1; } else { $("#paragraph").fadeOut(); }});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><p id="paragraph">This is a paragraph</p><button>Click me</button>
2 回答
皈依舞
TA贡献1851条经验 获得超3个赞
原因是您使用的 css 赋值语法错误。控制台会提醒您这一点。进行如下更改。
<script
src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
crossorigin="anonymous"></script>
<body>
<p id="paragraph">This is a paragraph</p>
<button>Click me</button>
<script type="text/Javascript">
$("button").click(function(){
if ($("#paragraph").css("display") =="none"){
$("#paragraph").css("display", "block");
$("#paragraph").css("opacity", '1');
}
else{
$("#paragraph").fadeOut();
}
});
</script>
</body>
你可以忽略我是如何包含 jquery 的。我这样做只是为了确保它在这里都可以运行。
料青山看我应如是
TA贡献1772条经验 获得超8个赞
使用快捷方式show()而不是css()让它变得简单
$("button").click(function() {
const $p = $("#paragraph");// cache element reference once for efficiency
if ($p.is(':hidden')) {
$p.show();
} else {
$p.fadeOut();
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id="paragraph">This is a paragraph</p>
<button>Click me</button>
添加回答
举报
0/150
提交
取消