rstJkee
@rstJkee

Выделить весь текст в contenteditable div?

Привет! есть разметка
<tr class="text-center">
    <th>${id}</th>
    <td><div class="form-control" contenteditable="true">${text1}</div></td>
    <td><div class="form-control" contenteditable="true">${text2}</div></td>
    <td><div class="form-control" contenteditable="true">${text3}</div></td>
    <td><div class="form-control" contenteditable="true">${text4}</div></td>
    <td><div class="form-control" contenteditable="true">${text5}</div></td>
    <td class="d-flex flex-row align-items-center justify-content-center">
        <button class="upd btn btn-primary me-1">&uparrow;</button>
        <button class="del btn btn-primary btn-close me-1"></button>
    </td>
</tr>

Как можно выделить весь text5, например?
<div class="form-control" contenteditable="true">${text5}</div>
  • Вопрос задан
  • 314 просмотров
Решения вопроса 4
DanArst
@DanArst Куратор тега JavaScript
Гриффиндор в моде при любой погоде!
С использованием jQuery можно сделать выделение всего текста при клике например так:
Ответ написан
MrDecoy
@MrDecoy Куратор тега JavaScript
Верставший фронтендер
Теория с примерами как выделять элементы или текст: Selection and Range
Ответ написан
rstJkee
@rstJkee Автор вопроса
Возможно, кому-то поможет, ОБЯЗАТЕЛЬНО делать через selectNodeContents вместо selectNode
$("#root").on("click", (e) => {
        console.log(e.target.tagName)
        if (e.target.tagName === "DIV") {
            let rng = document.createRange()
            let sel = window.getSelection()
            rng.selectNodeContents($(e.target)[0])
            sel.removeAllRanges()
            sel.addRange(rng)
        }
    })

P. S.: у меня разметка добавляется по мере поступления ответов от сервера, так что тут захватывается контейнер root, на него накидывается обработчик onclick, затем проверяется, что был нажат именно блок div и только после этого всё, что в нём есть, выделяется
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
29 мар. 2024, в 15:28
10000 руб./за проект
29 мар. 2024, в 15:11
50000 руб./за проект
29 мар. 2024, в 15:06
50000 руб./за проект