Как можно выделить текст внутри div
-элемента при клике на него? В jQuery
нет стандартного метода для такого действия?
2 ответа
Существует спецификация (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.
<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>