HTML сбрасывает позицию каретки - PullRequest
Новая
       9

HTML сбрасывает позицию каретки

1 голос
/ 18 января 2020

В пределах Contenteditable Я пытаюсь что-то изменить во время выполнения. Чтобы заменить текст на элемент, так сказать. Всякий раз, когда я заменяю текст, позиция каретки сбрасывается на 0 , мой p-тег состоит из множества других элементов, таких как b, i, span , а иногда и a. Если я заменю на, позиция каретки сбрасывается на начало. Мне просто не хватает логического подхода, как получить, например, новую позицию каретки за новым элементом. Я думаю, что у меня уже есть большинство тем на этом топи c. Поэтому сейчас я задам свой первый вопрос здесь.

JSFidle: https://jsfiddle.net/eLv6p9kj/3/

Код JS: 

function clickFunctionMouse(){
    	let text = $("#pelement").html();
      //Replace the text with a image. 
    	text = text.replace('<span>Text <b>sample</b><span>', '<img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png">')
    	//Setting new HTML to Element. But how to get Caret-Position of the new Element?
    	$("#pelement").html(text);
}
$('#pelement').on("input", clickFunctionMouse);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
To show my problem, dont edit the text inside the span element..

<p contenteditable="true" id="pelement"><b>Hello</b> How are <i>you</i> <span>Text <b>sample</b><span> I dont know what else I could write <b>here!</b></p>

Большое спасибо заранее за помощь из дождливой Германии и спокойной ночи.

...