Я определяю событие «отправить» следующим образом:
HTML-код:
<div class = "messages">
<ul>
<li class = "sent">
<img src = "/img/person1.png" alt = "" />
<p>How the hell am I supposed to get a jury to believe you when I am not even sure that I do?!</p>
</li>
<li class = "replies">
<img src = "/img/botimg.png" alt = "" />
<p>When you're backed against the wall, break the god damn thing down.</p>
</li>
<li class = "replies">
<img src = "/img/botimg.png" alt = "" />
<p>Excuses don't win championships.</p>
</li>
<li class = "sent">
<img src = "/img/person1.png" alt = "" />
<p>Oh yeah, did Michael Jordan tell you that?</p>
</li>
<li class = "replies">
<img src = "/img/botimg.png" alt = "" />
<p>No, I told him that.</p>
</li>
</ul>
</div>
<div class = "message-input">
<div class = "wrap">
<input type = "text" placeholder = "Write your message..." />
<i class = "fa fa-paperclip attachment" aria-hidden = "true"></i>
<button class = "submit"><i class = "fa fa-paper-plane" aria-hidden = "true"></i></button>
</div>
</div>
Вспомогательная функция:
function newMessage() {
console.info("Inside newMessage");
message = $(".message-input input").val();
if ($.trim(message) == '') {
return false;
}
$('<li class = "sent"><img src = "/img/person1.png" alt = "" /><p>' + message + '</p></li>').appendTo($('.messages ul'));
$('.message-input input').val(null);
$(".messages").animate({ scrollTop: $(document).height() }, "fast");
};
Функция отправки клика:
$('.submit').click(function() {
newMessage();
});
Теперь всякий раз, когда я нажимаю кнопку отправки, сообщение «Inside newMessage» постоянно регистрируется в консоли JavaScript.
Ваш код работает нормально. Не могли бы вы создать рабочую скрипку.
Можно прочитать о браузере, который вы используете, и о поддержке функции анимации - предостережения и т. д. - я выполнил ваш код и не могу воспроизвести бесконечный цикл. Можно изменить его на window.scroll({top: 0, left: 0, behavior: 'smooth' });
Ваш код у меня работает без ошибок.
Работает при нажатии вошел. Он застревает в бесконечном цикле при нажатии кнопки отправки.
Если вы замените console.info()
на alert()
, вы увидите, что одно и то же сообщение бесконечно печатается снова и снова.
Опубликуйте минимальный воспроизводимый пример.
Вот рабочий пример: jsfiddle.net/37gsfL8o
Странно, мой код работает там в скрипке, но зависает в Chrome. Любые подсказки этого необычного поведения?
Этот код скрипки является полным кодом. Я просто пытаюсь создать фиктивный чат-бот для практики. Код не для конкретной организации.
Это не "минимум", это куча кода. Он даже не разделен на HTML, CSS и JavaScript.
Да, именно поэтому я не хотел помещать весь код и оставил только минимальный код в этом посте. Но некоторым людям нужен работающий код скрипки.
Еще одно наблюдение, которое у меня есть, это то, что код работает в режиме «инкогнито» Chrome, но не в обычном режиме.
Поскольку это исправлено очисткой кеша, думаю, вопрос можно закрыть. Из официальных причин закрытия: Этот вопрос был вызван проблемой, которая больше не может быть воспроизведена, или простой типографской ошибкой. Хотя подобные вопросы могут быть здесь по теме, этот был решен способом, который вряд ли поможет будущим читателям.
@halfer Я также только что проголосовал за закрытие этого вопроса. Как глупо я был, чтобы открыть этот вопрос. Закроем вместе. :)
Совсем не глупо — часто задаваемый вопрос действует как резиновая утка. В моей истории Stack Overflow есть множество вопросов, на которые я сам ответил :-)
Теперь он работает после очистки истории просмотров Chrome, особенно «файлов cookie и других данных».
Мое лучшее предположение было бы, потому что ваш
animate({})
зацикливается навсегда. Это самый распространенный знаменатель в таких вопросах