I am currently facing an issue with a div element that serves as user input:
<div id="chat-message-input" contenteditable="plaintext-only">Upon pressing the enter key (without holding down the shift key), the user's text gets submitted.
<script>
document.querySelector('#chat-message-input').onkeyup = function(e) {
// User hits enter key and is not holding shift
if (e.keyCode === 13 && event.shiftKey != 1) {
//Click submit button
document.querySelector('#chat-message-submit').click();
// Clear input field
document.getElementById('chat-message-input').innerHTML='';
};
</script>
Issue at Hand: A new line is briefly created in the div upon hitting the enter key, before the content within the div is cleared.
I would like a new line to be created only under the following conditions:
- The user's input text extends to the end of the line
- The user holds down shift while pressing enter
Is there a way to prevent the creation of a new line in accordance with the above requirements?