如何将 onclick 与文本区域一起使用

How to use onclick with a textarea

本文关键字:区域 一起 文本 onclick      更新时间:2023-09-26

我希望能够在用户单击文本区域时弹出div。法典:

.CSS:

#comment{
    width: 500px;
    height:500px;
    background-color: black;
    position: fixed;
    left: 250px;
    top: 250px;
    float: left;
    display: none;
}

.JS:

function comment() {
            if (document.getElementById('comment').style.display = 'none') {
                document.getElementById('comment').style.display = "inline";
                document.getElementById('container').style.opacity = opacity = 0.1;
            }
        }

.HTML:

<input type="text" id="textarea" value="Comment..." style="color: #808080;" onclick="comment();">
<div id="comment"></div>

阅读下面的 3 条评论后,我已经解决了我的问题,但现在我希望div id="comment" 在中间弹出(它有(,它后面的其他一切都淡出。

上面的代码使一切都褪色了。div id="comment" 在 #container 内,但有没有办法阻止这个随着一切而淡出?

您忘记了style的属性值末尾的"。因此,onclick属性名称被视为style属性值的一部分。

如果您使用验证器,就会选择它。

<input type="text" id="textarea" value="Comment..." style="color: #808080; onclick="comment();">

您在style="color: #808080;后缺少结束语

顺便说一句,这里的代码突出显示器向我指出了这一点。 如果您使用任何类型的带有语法突出显示的程序员编辑器,它也会向您指出。

你的代码中有很多错误。

  1. "@Quentin提到
  2. 您需要使用getComputedStyle来获得实际样式。
  3. document.getElementById('comment').style.display == "";毫无意义。您需要使用 = 而不是 == 并且需要指定正确的显示'block'

法典

function comment() {
    var comment = document.getElementById('comment');
    if (getComputedStyle(comment).display == 'none') {
        comment.style.display = 'block';
    }   
}

http://jsfiddle.net/tarabyte/uvnhtmtv/