The information that the textarea
automatically has must also pass to the div editable
, and vice versa, that is, if I get to write in the div it must also pass in the textarea
both must have a connection, for now I have the following but it does not work:
$(function() {
let EditHTML = $("#detail");
EditHTML.on("keyup", function(e) {
$("#editor").val(EditHTML.html());
$("#editor").keyup();
});
});
#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>