Question

我有一个用户点击进入后清除的文本区域。我想将光标重置到文本区域的开头，但由于某种原因，它被放置在第二行的开头，并返回一个空行和第二次按下Enter时的文本。当再次点击Enter时，文本被清除，插入符号保留在第二行，只有第一次才会到达第二行。

$(function(){
    var chatArea;
    chatArea = $("#chattingArea").keypress(function(event){
        if(event.which === 13){
            console.log($("#theTextbox").val());
            $("#theTextbox").val("");
            $("#theTextbox")[0].setSelectionRange(0, 0);
        }
    });
});

HTML：

` ChatApp

<div id="chattingArea">
    <textarea id="theTextbox"></textarea>
</div>
<div id="chat">

</div>

<script src="bower_components/jQuery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/jquery-ui/ui/minified/jquery-ui.min.js"></script>
<script src="chatApp.js"></script>
</body>

`

Answer 1

使用keyup代替keypress来阻止调用文本区域中的原生keypress事件

<强> HTML

<textarea rows="4" cols="50" id="chat">
At w3schools.com you will learn how to make a website. We offer free tutorials in all web development technologies. 
</textarea>

<强> Jquery的

$("#chat").keyup(function(e){
    if(e.which === 13){
        $("#chat").val("");
    }
})

Demo JSfiddle

清除后，恢复到文本区域框的开头

1 个答案: