gpt4 book ai didi

javascript - 如何使用 onfocus 显示和隐藏一个 div

转载 作者:行者123 更新时间:2023-11-30 10:53:44 24 4
gpt4 key购买 nike

我对此有点陌生。到目前为止我有这个:

<style type="text/css">
#show_hide{display:none;}
</style>

<div id="show_hide">
ok
</div>

<input type="text" onfocus="document.getElementById('show_hide').style.display='block';">

当我单击输入框以显示 div 时,它起作用了。当我点击其他地方或“散焦”有什么帮助时,我是否需要它再次隐藏?谢谢!

最佳答案

因此,您的问题是您的 CSS 设置了 div 的默认状态(display:none),然后您的 JavaScript 将状态 onfocus 更改为 display: block --但是您没有任何代码可以将 div 恢复为隐藏状态。

使用纯 JavaScript,我相信您会希望 onblur 事件(焦点丢失)来处理此问题:

<input type="text" 
onfocus="document.getElementById('show_hide').style.display='block';"
onblur="document.getElementById('show_hide').style.display='none';">

Here it is in action, with your sample

关于javascript - 如何使用 onfocus 显示和隐藏一个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3586546/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com