Блог

Главная - Вопросы по программированию - Как предотвратить проблему с длинной кнопкой ввода в чате

Как предотвратить проблему с длинной кнопкой ввода в чате

#javascript #jquery #chat

#javascript #jquery #Чат

Вопрос:

Привет, я использую ajax-чат, в котором, если мы нажмем enter, он запустит кнопку отправки.если мы нажмем кнопку ввода один раз, проблем не возникнет. если мы долго нажимаем кнопку ввода, вызов отправки повторяется, и сообщение чата сохраняется несколько раз. пожалуйста, помогите по этому вопросу пример кода jquery:

 $("#chat_message").keypress(function(event) {
        if (event.which == 13) {
            event.preventDefault();
            $( "#send-btn" ).click();
            return false;
        }
    });

html-код:

 <input type="text"  name="message" id="chat_message" >
 <button type="button" id="send-btn">Send</button>

Комментарии:

1. Также проверьте значение $("#chat_message")

2. используйте on keyup вместо нажатия клавиши

3. @cheralathan пожалуйста, проверьте html-код, ввод ключа не применим для этого сценария. И я проверяю, что это не работает

Ответ №1:

Ну keyup , событие отлично работает в вашем случае.

Пожалуйста, взгляните на приведенный ниже код.

 $(document).ready(function(){
   
  //the keyup event
  $("#chat_message").keyup(function(event) {
        if (event.which == 13) {
            event.preventDefault();
            $( "#send-btn" ).click();

            return false;
        }
  });
  
  $( "#send-btn" ).on("click",function(){
    console.log($("#chat_message").val());
  });
});  
 <html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  </head>
  <body>
    <input type="text"  name="message" id="chat_message" >
  <button type="button" id="send-btn">Send</button>
</body>
</html>

Ответ №2:

Спасибо за ответ, и я получил решение,

  $("#chat_message").keypress(function(event) {
    if (event.which == 13) {
     event.preventDefault();
      if ($('#chat_message').val() != "") {
        $("#send-btn").click();
        $('#chat_message').val("");
     }
   return false;
    }
  });