Форум

Olena · #1 (**permalink**) 01.03.2015, 02:05

Такая проблема, решить ее не могу(

Есть такой скрипт:

<!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>

Olena · #2 (**permalink**) 01.03.2015, 02:07

И если можно что бы js был по проще...

danik.js · #3 (**permalink**) 01.03.2015, 18:50

Не знаю насколько кроссбраузерен код, вроде работает в последних версиях браузеров, а в 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>

Olena · #4 (**permalink**) 01.03.2015, 19:01

Спасибо большое!
Важна очень кроссбраузерность этого кода.
Пока попробую Ваш код на тест как пройдет, сама остановилась на этом решении:

<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.

Форум

Справочник

Discord чат

Курсы javascript