¿Cómo puedo hacer una "entrada" que le permita ingresar solo letras de vocales? También se debe filtrar la copia y el arrastre de texto al campo de entrada.
<div class="field"> <input class="field_word" type="text"> </div> const field = document.querySelector('.field'); const fieldWord = document.querySelector('.field_word'); fieldWord.onkeypress = (event) => { if ((event.keyCode > 48) || (event.keyCode < 90)) { event.preventDefault();Puede usar la función a continuación para filtrar su entrada a un determinado conjunto de caracteres:
// Restricts input for the given textbox element to the given inputFilter. function setInputFilter(textbox, inputFilter) { ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) { textbox.addEventListener(event, function() { if (inputFilter(this.value)) { this.oldValue = this.value; this.oldSelectionStart = this.selectionStart; this.oldSelectionEnd = this.selectionEnd; } else if (this.hasOwnProperty("oldValue")) { this.value = this.oldValue; this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd); } else { this.value = ""; } }); }); } // Example USE: Install input filters. setInputFilter(document.getElementById("vowelTextbox"), function(value) { return /^[aioueAIOUE]*$/i.test(value); }); <h2>JS input filter vowels</h2> <p> Supports Copy+Paste, Drag+Drop, keyboard shortcuts, context menu operations, non-typeable keys, the caret position, different keyboard layouts, and all browsers since IE 9 </p> <input id="vowelTextbox">NOTA: Fragmento tomado y editado de este JSFiddle