如何在 html textarea 中使用 enter press 提交表单

Question

我想在文本区域中按回车键后立即提交表单，这对于输入类型的文本工作正常，但我不知道如何在文本区域中执行此操作。我必须使用文本区域，因为我希望文本输入是可扩展的，我怎样才能让它工作？谢谢

<div ng-app="myApp" ng-controller="myCtrl">
    <form ng-submit="sendMessage(newMessageContent)">

    First Name: <input type="text" ng-model="firstName"><br>
    Last Name: <input type="text" ng-model="lastName"><br>
    <br>
    Full Name: {{firstName + " " + lastName}}
    <textarea id="typeMessageBox" placeholder="Write here and hit enter to send..." type="text submit" class="form-control-lg form-control" ng-model="newMessageContent"></textarea>
    </form>
</div>

Answer 1

您可以使用以下 jQuery 代码在您的文本区域中点击 Enter 时提交表单：

$("#typeMessageBox").keypress(function (e) {
  if (e.which === 13 && !e.shiftKey) {
    e.preventDefault();
    $(this).closest("form").submit();
  }
});

也就是说，这可能不是一个好主意。如果你想要一个可扩展的字段，那肯定是因为你会有几行文本，因此几乎可以肯定是一个换行符。

我强烈建议您添加帮助文本，说明您将在输入 Enter 时提交表单，因为您的用户会对这种行为感到非常惊讶。

更好的是：不要试图改变本机行为。 textarea 像这样工作是有充分理由的，每个人都习惯了。更改其行为对您来说似乎是个好主意，但您可能会失去用户。

Answer 2

你可以使用ng-keypress然后检查keypress是否等于enter然后调用提交表单函数

在你的文本区域应该是

<textarea ng-keypress="getkeys($event)" ng-model="newMessageContent"></textarea>

那么你的angular代码应该是

$scope.getkeys = function (event) {        
   if(event.keyCode == 13){
     $scope.sendMessage( $scope.newMessageContent );
   }        
}

如何在 html textarea 中使用 enter press 提交表单

How to submit form with enter press in html textarea

javascript

html

jquery

angularjs