Question

我一直试图在用户点击进入时更改textarea的高度，这样他们就不必滚动了。我可以在IE和Chrome上管理它但是我无法在Firefox上运行它。请看看我的代码。我真的很陌生。它似乎无法识别事件，我无法找到解决方法。这是我的代码：

<form id="blog-comment-form" method="post" action="index.php">
<textarea id="comment" name="b_com" onkeyup="showmsg()"  placeholder="ADD YOUR COMMENT HERE"></textarea>
<input type="submit" name="submit" value="POST COMMENT"/>
</form>

我从外部文件调用该函数。我的javascript代码：

function showmsg() {

    if(!event){
           event= window.event;}
    if (event.keyCode==13) {
        var a = document.getElementById("comment");
    var b = document.getElementById("comment").style.scrollHeight;
    a.style.height = ((a.scrollHeight)+6) + "px"; 
}else {
    var a = document.getElementById("comment");
    var b = document.getElementById("testthis").style.height;
    a.style.height = ((a.scrollHeight)+6) + "px"; 
}

}

谢谢

Answer 1

您需要在文本区域添加rows属性。这将有助于你增加textarea的高度

Answer 2

您可以以不同的方式监听keyup事件，而不是使用onkeyup属性，这也将为您创建事件对象：

document.getElementById('comment').addEventListener('keyup', showmsg);

一个工作示例： http://jsfiddle.net/rotev/FKDVD/1/

在Firefox和Chrome上测试过。

Answer 3

您的代码存在一些问题。在某些浏览器上，您的事件处理可能无法正常工作。

首先，您需要从回调本身获取事件，而不是使用名为event的全局变量。

要调整textarea的大小，您可以使用属性cols和rows。

要处理该事件，您可以通过以下方式附加回调：

function init(){
    var e = document.getElementById("comment");
    e.onkeyup = showmsg;
}

有关事件监听器的更多信息，请检查this out。要调整textarea的大小，您可以使用行：

function showmsg(event) {
    if (event.keyCode==13) {
        var a = document.getElementById("comment");
        a.rows++;
    }
}

要调用init，您可以将其关联到元素正文：

<body onload="init()">

最终代码如下：

<html>
<head>
<script>
function init(){
    var e = document.getElementById("comment");
    e.onkeyup = showmsg;
}
function showmsg(event) {
    if (event.keyCode==13) {
        var a = document.getElementById("comment");
        a.rows++;
    }
}
</script>
</head>
<body onload="init()">
<form id="blog-comment-form" method="post" action="index.php">
<textarea id="comment" name="b_com" placeholder="ADD YOUR COMMENT HERE"></textarea>
<input type="submit" name="submit" value="POST COMMENT"/>
</form>
</body>
</html>

Answer 4

写下这个：

function showmsg(event) {

取代：

function showmsg() {

和

写这个（在HTML标记中）：

onkeyup="showmsg(event)"

取代：

onkeyup="showmsg()"

firefox改变textarea的高度，输入不工作

4 个答案: