Skip to main content
2 de 2
Se ejecuta cuando el documento esta listo
Abraham Chan
  • 1.2k
  • 4
  • 14

El detalle está en el val y el html, también puedes tener dos funciones para poder lograr escribir lo mismo en los dos elementos.

$(document).ready(function(){
            var EditHTML = $("#detail");
            $("#editor").html(EditHTML.val());
        });
    
$(function() {    
  var EditHTML = $("#detail");
    EditHTML.on("keyup", function(e) {
        $("#editor").html(EditHTML.val());
    });
});

$(function() {
  var EditHTML = $("#editor");
    EditHTML.on("keyup", function(e) {
        $("#detail").val(EditHTML.html());
    });
});
#editor {
    resize: vertical;
    overflow: auto;
    border: 1px solid silver;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    min-height: 100px;
    padding: 1em;
    background-color: white;
    width: 100%;
    color: #333;
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<textarea id="detail">Esta información debe pasar al div editable y viceversa, es decir todo cambio que se realicen tanto en el textarea con el div editable en ambos se debe mostrar </textarea>
<div id="editor" contenteditable></div>

Abraham Chan
  • 1.2k
  • 4
  • 14