Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как отменить выделения (https://javascript.ru/forum/misc/31633-kak-otmenit-vydeleniya.html)

dmitry111 15.09.2012 05:11

Как отменить выделения
 
Хочу отменить возможность выделений дочерних элементов у родителя

...
parent.onmousedown = parent.onselectstart = function() {
  return false;
}


но при этом исключить это правило для некоторых дочерних элементов.


Можно было бы назначить функцию выше на каждый элемент индивидуально, но я так не хочу.

Как это сделать?

dmitry111 15.09.2012 05:16

Вот пример

<!DOCTYPE HTML>
<html>
<head>
</head>
<body onmousedown="return false" onselectstart="return false">
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#0f0; width:200px; margin:4px;" id="on2">Разрешить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#0f0; width:200px; margin:4px;" id="on1">Разрешить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
</body>
</html>

devote 15.09.2012 05:18

Цитата:

Сообщение от dmitry111
<body onmousedown"function() {return:false;}">

<body onmousedown="return false;">

dmitry111 15.09.2012 05:26

devote,
да, писал сходу, методом проб и ошибок :)

dmitry111 15.09.2012 05:27

Так же хотел бы узнать, зачем использовать onselectstart? Ведь ie понимает onmousedown.

devote 15.09.2012 06:02

Цитата:

Сообщение от dmitry111
Ведь ie понимает onmousedown.

наверно для того что бы ссылки в тексте работали... иначе переход по ссылкам перестанет работать

dmitry111 15.09.2012 07:34

спасибо!

а как исключить эти события для некоторых вложенных элементов?

dmitry111 15.09.2012 15:17

Ну хоть кто-нибудь....... :help:

dmitry111 16.09.2012 09:37

:help: :help: :help: :help: :help: :help:

ну неужели нужно будет отменять функцию выделения у каждого элемента индивидуально??

У меня тысяча дочерних элементов, и только в двух нужно дать возможность выделять!

Мне надо 998 раз писать эту хрень :

...
child.onmousedown = child.onselectstart = function() {
  return false;
}



ХЕЕЕЕЕЛП!!! :help: :help: :help: :help: :help: :help: :help: :help: :help:

dmitry111 16.09.2012 10:07

:write:
Сделал, работает:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body onmousedown="return false" onselectstart="return false">
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#0f0; width:200px; margin:4px;" id="on2">Разрешить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#0f0; width:200px; margin:4px;" id="on1">Разрешить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
  
  <script>
    document.getElementById("on2").onmousedown = function (event) {
    	event.stopPropagation();
    };      
    document.getElementById("on2").onselectstart = function (event) {
    	event.stopPropagation();	
    };
  </script>
  
    <script>
    document.getElementById("on1").onmousedown = function (event) {
    	event.stopPropagation();
    };      
    document.getElementById("on1").onselectstart = function (event) {
    	event.stopPropagation();	
    };
  </script>
  
</body>
</html>



Объясните почему работает?

event.stopPropagation() блокирует всплытие, а тут наоборот вроде как :blink:

Dim@ 16.09.2012 10:31

Цитата:

Сообщение от dmitry111
Объясните почему работает?

stopPropagation блокирует всплытие и до body оно не доходит, поэтому body не может его заблокировать
P.S. в ИЕ работает?

dmitry111 16.09.2012 10:43

Цитата:

Сообщение от Dim@ (Сообщение 204936)
stopPropagation блокирует всплытие и до body оно не доходит, поэтому body не может его заблокировать
P.S. в ИЕ работает?

спасибо!

в ie<9 нет конечно :) В остальных не проверял

Dim@ 16.09.2012 11:03

dmitry111,
можно сделать и для ИЕ 9> ща попробую

Dim@ 16.09.2012 11:06

dmitry111,
проверь в ИЕ (у меня линукс я не могу посмотреть:) )
<html>
<head>
</head>
<body>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
  <div style="background:#0f0; width:200px; margin:4px;" id="on2">Разрешить выделение<div>loloooooooool</div></div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#0f0; width:200px; margin:4px;" id="on1">Разрешить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<div style="background:#f00; width:200px; margin:4px;">Запретить выделение</div>
<script>
document.body.onmousedown = document.body.onselectstart = function (e){
  var e = e || window.event;
  var target = e.target || e.srcElement;
  try{(function (tar, mass) {
    for (var i = 0; i < mass.length; i++) {
     if (mass[i] == tar || mass[i].contains(tar)) return true;
    }
    return false;
  })(target, [document.getElementById("on2")]);
 }
 catch (exp) {
  console.log(exp);
 }
}
</script>
</body>
</html>

Dim@ 16.09.2012 11:08

ой туплю, у ИЕ есть canceBabble
element.onclick = function(event) {
  event = event || window.event; // Кроссбраузерно получить событие
     
  if (event.stopPropagation) { // существует ли метод?
    // Стандартно:
    event.stopPropagation();
  } else {
    // Вариант IE
    event.cancelBubble = true;
  }
}

dmitry111 16.09.2012 11:33

у меня os x, не могу :)

Dim@, последняя должна работать!

Dim@ 16.09.2012 13:35

dmitry111,
да :)


Часовой пояс GMT +3, время: 09:46.