Question

我在简单的聊天应用中使用textarea。我想只在用户点击shift + return时启用回车，并在用户单独点击返回键时提交表单。

我正在使用ngKeydown指令。问题是，当我按Enter键时，消息发送正常，textarea被清除，然后插入回车符。这意味着事件不断传播......

以下是HTML代码：

<textarea ng-model="messageTyped" ng-keydown="checkReturn($event)"></textarea>

这里是angularjs代码：

function chatController($scope, ChatService) {

  $scope.messages = ChatService.messages

  $scope.checkReturn = function(event) {

    if (event.keyCode == 13 && !event.shiftKey) {

      event.stopPropagation() // <------ this line seems to have no effect

      // submit the message:
      if ($scope.messageTyped) {

        ChatService.SendMessage($scope.messageTyped)
        $scope.messageTyped = ""

      }
    }
  }
}

我不知道我错过了什么...谢谢你的帮助！

Answer 1

我建议为此编写一个自定义指令。然后你可以将它重用于你想要的任何元素。以下是使用它移动到下一个输入元素的示例。只需将enter-next放入你想拥有此能力的任何元素中。

.directive('enterNext', function() {
  return {
    restrict: 'A',
    link: function($scope,elem,attrs) {
      elem.bind('keydown', function(e) {
        var code = e.keyCode || e.which;
        if ((code === 13) && (e.shiftKey)) {
          e.preventDefault();
          elem.nextAll('input').first().focus();
        }
      });
    }
  }
});

Answer 2

可以使用ng-keyup并且没有任何指令来完成：

<textarea ng-keyup="$event.keyCode === 13 && (!$event.shiftKey) && TARGET_FUNCTION()"></textarea>

如何仅使用shift + return启用回车

2 个答案: