Бывает необходимо выделить текст параграфа тройным кликом, но если этот текст содержит переносы br - то выделение будет ограничено
Например есть такой html:
<p>Lorem ipsum<br />новая строка<br />третья строка</p>
если мы попытаемся выбрать текст тройным кликом, то выберем только часть. Один из вариантов проверять тройной клик при помощи JS и выбирать абзац. Для того чтобы ограничить такие действия - лучший вариант ограничить классом блока (например click3selectPText)
JS скрипт будет следующим:
document.addEventListener('DOMContentLoaded', function() {
const clickElement = document.querySelector('.click3selectPText');
if (clickElement) {
let lastClickTime = 0;
let clickCount = 0;
clickElement.addEventListener('click', function(e) {
const currentTime = new Date().getTime();
// Если прошло больше 500ms с последнего клика - сбрасываем счетчик
if (currentTime - lastClickTime > 500) {
clickCount = 0;
}
clickCount++;
lastClickTime = currentTime;
// Если это тройной клик
if (clickCount === 3) {
const paragraph = this.querySelector('p');
if (paragraph) {
selectAllText(paragraph);
e.preventDefault();
}
clickCount = 0;
}
});
function selectAllText(element) {
const selection = window.getSelection();
const range = document.createRange();
range.selectNodeContents(element);
selection.removeAllRanges();
selection.addRange(range);
}
}
});
Класс можно изменить на свой, возможно какой-то уже используете для текста контента