Как сделать? Выделение текста в div при нажатии на ссылку
Такая проблема, решить ее не могу( :blink:
Есть такой скрипт:
<!DOCTYPE HTML>
<html>
<head> </head>
<body>
<div class="example" style="border:1px inset;max-height:200px;overflow:auto;height:expression(this.scrollHeight<5?this.style.height:scrollHeight>200?'200px':''+(this.scrollHeight+5)+'px');">
<!--this_code-->
dsdsdsdsdjshdjshjkdhskjhdks<br>
dfdffffffffffffffffffffffffffffffffffffffffffffffff
<!--/this_code-->
</div>
<script type="text/javascript">
$('div.example').click(function() {
var e=this;
if(window.getSelection){
var s=window.getSelection();
if(s.setBaseAndExtent){
s.setBaseAndExtent(e,0,e,e.innerText.length-1);
}else{
var r=document.createRange();
r.selectNodeContents(e);
s.removeAllRanges();
s.addRange(r);}
}else if(document.getSelection){
var s=document.getSelection();
var r=document.createRange();
r.selectNodeContents(e);
s.removeAllRanges();
s.addRange(r);
}else if(document.selection){
var r=document.body.createTextRange();
r.moveToElementText(e);
r.select();}
});
</script>
</body>
</html>
При клике на область div-a он выделяет ее. Как сделать, что бы div выделялся при нажатии ссылки возле него? Таких блоков может быть > 1 на одной странице. Вот так как-то: <a href="javascript://" onclick="select-example(this);return false;">Выделить всё</a> <div class="example" style="border:1px inset;max-height:200px;overflow:auto;height:expression(this.scrollHeight<5?this.style.height:scrollHeight>200?'200px':''+(this.scrollHeight+5)+'px');"> <!--this_code--> dsdsdsdsdjshdjshjkdhskjhdks<br> dfdffffffffffffffffffffffffffffffffffffffffffffffff <!--/this_code--> </div> |
И если можно что бы js был по проще... :cray:
|
Не знаю насколько кроссбраузерен код, вроде работает в последних версиях браузеров, а в IE - начиная с 9 версии:
Код проще некуда:
<script>
function selectExample(link) {
var example = link.nextElementSibling;
var selection = window.getSelection();
selection.selectAllChildren(example);
}
</script>
<a href="javascript://" onclick="selectExample(this)">Выделить всё</a>
<div class="example" style="border:1px inset;max-height:200px;overflow:auto;height:expression(this.scrollHeight<5?this.style.height:scrollHeight>200?'200px':''+(this.scrollHeight+5)+'px');">
<!--this_code-->
dsdsdsdsdjshdjshjkdhskjhdks<br>
dfdffffffffffffffffffffffffffffffffffffffffffffffff
<!--/this_code-->
</div>
|
Спасибо большое!
Важна очень кроссбраузерность этого кода. Пока попробую Ваш код на тест как пройдет, сама остановилась на этом решении:
<script type="text/javascript">
function selectCode(a){
var e=a.parentNode.parentNode.getElementsByTagName('code')[0];
if(window.getSelection){
var s=window.getSelection();
if(s.setBaseAndExtent){
s.setBaseAndExtent(e,0,e,e.innerText.length-1);
}else{
var r=document.createRange();
r.selectNodeContents(e);
s.removeAllRanges();
s.addRange(r);}
}else if(document.getSelection){
var s=document.getSelection();
var r=document.createRange();
r.selectNodeContents(e);
s.removeAllRanges();
s.addRange(r);
}else if(document.selection){
var r=document.body.createTextRange();
r.moveToElementText(e);
r.select();}}
</script>
Но здесь нужно что бы элементы для выделения были между тегом code. :thanks: |
| Часовой пояс GMT +3, время: 13:25. |