2

Как можно выделить текст внутри div-элемента при клике на него? В jQuery нет стандартного метода для такого действия?

0

2 ответа 2

8

Существует спецификация (Selection API), описывающая как JavaScript код может взаимодействовать с выделением текста на странице.

Не вдаваясь в детали покажу, как с помощью этого API выделить содержимое <div> при клике без использования jQuery:

document.getElementById('select-target').addEventListener('click', function() {
    var r = document.createRange();
    r.selectNode(this);
    document.getSelection().addRange(r);
});

Вот JSFiddle с примером.

Замечание:

Если вам нужно написать максимально кроссбраузерный код, то можно использовать библиотеки, оборачивающие Selection API, например, Rangy.

1

<script>
	function selectText(containerid) {
		if (document.selection) { // IE
			var range = document.body.createTextRange();
			range.moveToElementText(document.getElementById(containerid));
			range.select();
		} else if (window.getSelection) {
			var range = document.createRange();
			range.selectNode(document.getElementById(containerid));
			window.getSelection().removeAllRanges();
			window.getSelection().addRange(range);
		}
	}
</script>

<div id="example" onclick="selectText('example')">Hello This div content have to be select.</div>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.