Estoy creando un editor de texto simple y empiezo con lo básico: cuando el usuario presiona Intro y comienza una nueva línea, desea insertar br en el segundo cuadro de texto. El segundo cuadro de texto está destinado a enviar texto formateado listo para la base de datos. A partir de ahora, logré copiar datos del primer cuadro de texto al segundo mientras el usuario escribe. Por lo tanto, quiero deshabilitar la visualización de br en el primer cuadro de texto. ¿Hay alguna manera de no mostrar br en el primer cuadro de texto pero técnicamente tenerlo? ¡Gracias de antemano!
DEMOSTRACIÓN: https://jsfiddle.net/mxr7hz3p/
Cajas de texto:
<textarea type="text" id="first"></textarea> <textarea type="text" id="second"></textarea>
JS:
$(function (){ $('#first').keyup(function (e){ if(e.keyCode == 13){ var curr = getCaret(this); var val = $(this).val(); var end = val.length; $(this).val( val.substr(0, curr) + '<br>' + val.substr(curr, end)); }}) }); function getCaret(el) { if (el.selectionStart) { return el.selectionStart; } else if (document.selection) { el.focus(); var r = document.selection.createRange(); if (r == null) { return 0; } var re = el.createTextRange(), rc = re.duplicate(); re.moveToBookmark(r.getBookmark()); rc.setEndPoint('EndToStart', re); return rc.text.length; } return 0; }
$('#first').keyup(function(){ $('#second').val(this.value); });
Puede simplificar el JS en el violín para hacer esto
$('#first').keyup(function(){ var val = $(this).val(); val = val.replace(/\n/g, '<br />') $('#second').val(val); });