Javascript Formular mit Enter absenden aber mit Shift Enter einen Zeilenumbruch einfügen

Question

Wie kann ich bei Enter die Funktion sendMessgae aufrufen aber wenn ich Shift+Enter drücke einen Zeilenumbruch im Textfeld einfügen?

<div class="chat-container">
    <div id="chat-box" class="chat-box"></div>
    <div class="chat-input">
        <textarea id="user-input" placeholder="Nachricht eingeben..."></textarea>
        <button onclick="sendMessage()">Senden</button>
    </div>
</div>

Answer 1

Du kannst einen Listener registrieren und darin prüfen ob gleichzeitig die Shift Taste gedrückt wurde.

document.addEventListener("DOMContentLoaded", function() {
    const textarea = document.getElementById("user-input");
    textarea.addEventListener("keydown", function(event) {
        if (event.key === "Enter" && !event.shiftKey) {
            event.preventDefault();
            sendMessage();
        } else if (event.key === "Enter" && event.shiftKey) {
            textarea.value += "\n";
        }
    });
});