При нажатии Enter текстовое поле идет вниз по строке вместо вызова функции

Question

Я пытаюсь настроить веб-сайт для обмена сообщениями (в школьных целях).
Я хочу, чтобы, когда пользователь нажимает Введите , текст в текстовом поле будет отправлен на страницу PHP.называются InsertMessage.php и DisplayMessages.php и текстовое поле должно быть установлено на "".
Вместо этого, когда я нажимаю ввод, текстовое поле будет идти только вниз по линии.

$(document).ready(function() {

  $("#ChatText").keyup(function(e) {
    //when we press enter
    if (e.keycode == 13) {
      var ChatText = $("#ChatText").val();
      $.ajax({
        type: 'POST',
        url: 'InsertMessage.php',
        data: {
          ChatText: ChatText
        },
        success: function() {
          $("$ChatMessages").load("DisplayMessages.php");#
          ("ChatText").val("");
        }
      });
    }
  });

  setInterval(function() {
    $("#ChatMessages").load("DisplayMessages.php");
  }, 1500);

  $("#ChatMessages").load("DisplayMessages.php");
});

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="ChatBig">
  <div id="ChatMessages" class="scrollbar">
  </div>
  <textarea id="ChatText" name="ChatText" placeholder="Type Message..."></textarea>
</div>

Answer 1

когда вы проверяете ключ, он должен быть e.keyCode вместо e.keycode также есть много других опечаток

  $("$ChatMessages").load("DisplayMessages.php");
  #("ChatText").val("");

например, должно быть:

  $("ChatMessages").load("DisplayMessages.php");
  $("ChatText").val("");

может быть еще немного, поэтому проверьте ваш синтаксис

Рабочий фрагмент:

$(document).ready(function(){
    $("#ChatText").keyup(function(e){
        //when we press enter
        if(e.keyCode === 13)
        {
            var ChatText= $("#ChatText").val();
            $("#ChatText").val("");
        }
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="ChatMessages" class="scrollbar">
    <textarea id="ChatText" name="ChatText" placeholder="Type Message..."></textarea>
</div>