Блог

Привет,

У меня есть этот код:

 inputform.addEventListener('keypress', function(e) {
 const tgt = e.target;
 
 if (tgt.id==="usermsg") {
  if (e.which == 13 amp;amp; !e.shiftKey amp;amp; tgt.value) {
    tgt.value = '';
    tgt.setSelectionRange(0,0);
  }
 }
});
 

когда вы нажмете ENTER, он должен очистить ввод текстовой области и вернуть курсор в начало, но он этого не сделает. Вместо этого курсор остается на второй строке. Вот скрипка: https://jsfiddle.net/xbc0vong /

почему это?

Спасибо.

Используйте e.preventDefault(); , чтобы избежать поведения по умолчанию.

Попробуйте это

 inputform.addEventListener('keypress', function(e) {
 const tgt = e.target;
 
 if (tgt.id==="usermsg") {
  if (e.which == 13 amp;amp; !e.shiftKey amp;amp; tgt.value) {
    e.preventDefault();
    tgt.value = '';
    tgt.setSelectionRange(0,0);
  }
 }
});
 

Code sandbox => https://jsfiddle.net/pa6cjweo/1 /

Похоже, что после .value очистки атрибута требуется небольшая задержка. Использование setTimeout() сработало.

 const inputForm = document.forms[0];


inputForm.addEventListener('keypress', (e) => {
  const tgt = e.target;
  if (tgt.id === 'userMsg' amp;amp; e.keyCode === 13) {
    tgt.value = '';
    setTimeout(() => {
      tgt.focus();
      tgt.setSelectionRange(0, 0);
    }, 0);
  }
}); 

 <form id="inputForm">
  <textarea id="userMsg"></textarea>
</form>