Reemplace el carácter ‘a` que acaba de escribir con `ab`

Permítanme resumir la pregunta más claramente, ya que parece mal entendida en los comentarios.

En lo esencial, lo que quiero es reemplazar un carácter específico a con la entrada ab en el momento en que se escribe . No puedo ejecutar un comando de reemplazo de todos, ya que afecta más a ‘s que solo el que está escrito.

El método que he mostrado a continuación elimina el a y el add ab lugar, pero no en la misma ubicación . El ab se agrega al final de la entrada, no en el lugar donde se escribió la a. Así que no hace el reemplazo como se quería.

LA SITUACIÓN ACTUAL :

Cuando se presiona el botón de entrada, quiero que el \n cambie en
\n
.

De mucho buscar he llegado a algo como esto (la tecla enter tiene el código de clave 13):

 jQuery('textarea#comment').keyup(function(e){ var content = jQuery(this).val(); if(e.keyCode == '13') { e.preventDefault(); content=content+"
\n"; jQuery('textarea#comment').val(content); } });

Pero esta pieza de código no reemplaza el carácter \n escrito con
\n
. Simplemente impide que se imprima el carácter escrito y luego se agrega
\n
al final del contenido. Esto no funcionará cuando el usuario mueva el cursor y comience a escribir en otro lugar que no sea el final. El
\n
simplemente se agrega en una ubicación incorrecta.

La línea content=content+"
\n";
Es claramente incorrecto de usar. Necesito saber dónde se encuentra el carácter escrito para poder reemplazarlo en esa ubicación o debo editar el carácter escrito sobre la marcha antes de que se imprima en la pantalla.

Muchas otras respuestas a preguntas similares dan una solución de reemplazo total. Esto no funcionará para mí ya que el término de búsqueda \n está incluido en el término de pegado
\n
.

La parte difícil (desafortunadamente) de esto es insertar el texto en la posición del cursor en lugar de al final del área de texto.

Varias preguntas anteriores de SO han abordado cómo hacer esto, con diversos grados de compatibilidad con el navegador; Aquí hay una versión que modifiqué ligeramente de esta respuesta para que sea una extensión jQuery en lugar de una función independiente.

(Admito que no he probado la parte de IE de esto; mi caja de ventanas está completamente arriba).

 jQuery('textarea#comment').keydown(function(e) { if (e.key === 'Enter') { // keyCode is legacy: see https://www.w3.org/TR/DOM-Level-3-Events/#interface-keyboardevent $('textarea#comment').insertAtCaret("
\n"); // br won't work in a textarea, but I'll assume you have a good reason for this e.preventDefault(); // prevent the default character from being added (it can wind up in the wrong place) } }); jQuery.fn.extend({ insertAtCaret: function(insert) { var el = this[0]; // get DOM element instead of jQuery object if (document.selection) { // IE sel = document.selection.createRange(); sel.text = insert; } else if (el.selectionStart || el.selectionStart == '0') { // other browsers var startPos = el.selectionStart; var endPos = el.selectionEnd; el.value = el.value.substring(0, startPos) + insert + el.value.substring(endPos, el.value.length); el.setSelectionRange(endPos + insert.length, endPos + insert.length); // put the cursor at the end of the inserted text } else { // last resort, shouldn't ever get here this[0].value += insert; } } })
 textarea { width: 100%; height: 5em }