Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   проверки с in (https://javascript.ru/forum/misc/27472-proverki-s.html)

bes 13.04.2012 23:26

проверки с in
 
Знатоки, подскажите каким образом осуществлять подобные проверки.

Например, есть div со ссылкой: div - родительский элемент, ссылка - дочерний.
Нужно, чтобы при уходе мыши с div этот div скрывался, кроме тех случаев, когда уход происходит на его дочерний элемент (ссылку).
Решение, как видится, заключается во фразе "если уходишь не на дочерний элемент, то скрывайся".

Для браузеров с поддержкой target/relatedTarget, код такой.

Код:

<div id=div1 style="background: gray"
  onmouseout = "
    if (!(event.relatedTarget in this.children)) this.style.display = 'none';
">
<a href="">content</a>
</div>

Проверка event.relatedTarget in this.children почему-то всегда возвращает значение true.
Как правильно осуществить данную проверку?

Раед 13.04.2012 23:32

for (var i=0;i<this.children.length;i++) if(!(event.relatedTarget==this.children[i])) this.style.display = 'none';

bes 13.04.2012 23:52

Раед, спасибо, код работает (наверное ты сознательно использовал в цикле children, а не children[i]).
Но можно ли в принципе осуществить подобную проверку с in (и тем самым избавиться от использования цикла)?

Gvozd 13.04.2012 23:56

Цитата:

Сообщение от bes
Проверка event.relatedTarget in this.children почему-то всегда возвращает значение true.

вообще-то она ничего не возвращает и вызывает ошибку, потому что ее нельзя применять для this.children, потому что это не массив
И этот оператор ожидает левым операндом строку - имя индекса в объекте, поэтому его нельзя использовать для проверки наличия элемента в объекте
его надо использовать для проверки наличия элемента с указанным именем.
http://javascript.ru/in

Gvozd 14.04.2012 00:00

Цитата:

Сообщение от bes
наверное ты сознательно использовал в цикле children, а не children[i]

что за слепая вера?
Неужели трудно проанализировать три строчки кода, понять что они делают, и понять что это опечатка?!
Цитата:

Сообщение от bes
Но можно ли в принципе осуществить подобную проверку с in (и тем самым избавиться от использования цикла)?

МОжно проверять наоборот.
Вместо проверки что целевой элемент является потомком исходного, можно проверять является ли исходный элемент предком целевого

Gvozd 14.04.2012 00:15

Maxmaxmахimus,
У Вас jQuery головного мозга

bes 14.04.2012 00:50

Цитата:

Сообщение от Gvozd
вообще-то она ничего не возвращает и вызывает ошибку

Тем не менее, она возвращает true и не вызывает ошибки.

Цитата:

Сообщение от Gvozd
потому что ее нельзя применять для this.children, потому что это не массив

Что же это?

Цитата:

Сообщение от Gvozd
что за слепая вера?
Неужели трудно проанализировать три строчки кода, понять что они делают, и понять что это опечатка?!

Я поэтому и написал "сознательно": как я полагаю, приводился проверенный код, а [i] был убран для того, чтобы человек немного подумал.

Цитата:

Сообщение от Gvozd
МОжно проверять наоборот.
Вместо проверки что целевой элемент является потомком исходного, можно проверять является ли исходный элемент предком целевого

Причём здесь оператор in и как поместить эту проверку в обработчик события исходного элемента?

Цитата:

Сообщение от Maxmaxmахimus
jQuery('selector').mouseenter()
jQuery('selector').mouseleave()

Смысл приведённого примера является как раз частью того, каким образом можно эмулировать данные события.

Gvozd 14.04.2012 01:01

Цитата:

Сообщение от Maxmaxmахimus
у вас программирование ради прогарммирования, а не программирование ради продуктов.

Веткой форма не ошиблись?
Программирование ради продукта - это в разделе Работа.
Во всех остальных разделах форума цель - обмен и накопление опыта, обучение.
И если на этапе обучения пропустить основы языка, и написание велосипедов, то можно получить в итоге говнокодера.
Именно для этого обучающиеся пишут с нуля сортировки, реализуют с нуля двунаправленные списки и деревья, хотя все это уже релизовано сотни раз до них.
Или Вы сразу на jQuery научились писать, минуя этап обучения?
Цитата:

Сообщение от Maxmaxmахimus
Короли велосипедные - мы их называем.

Собирать каждый день по новому велосипеду - излишняя и ненужная работа.
Но не зная как устроен велосипед, далеко уехать не получится. Не дальше, чем сломается велосипед, или понадобится велосипед которого еще никто не создал, но который легко можно создать зная как устроены другие велосипеды.

Когда вам понадобится сделать 4-х колесный велосипед(чтоб им дети пользовались), вам будет недостаточно взять два уже существующих велосипеда и примотать синей изолентой друг к другу.
Получившаяся конструкция будет уродливой, и обладать рядом других минусов, чем если бы вы сделали 4-х колесный велосипед с нуля.

В общем если обойти этап создания велосипедов в процессе обучения, можно остаться простым пользователем чужих велосипедов, и не стать профессионалом.

Gvozd 14.04.2012 01:19

Цитата:

Сообщение от bes
Тем не менее, она возвращает true и не вызывает ошибки.

Да, я ошибся
Только true все-таки возвращается не event.relatedTarget in this.children, а !(event.relatedTarget in this.children)
event.relatedTarget in this.children возвращает false
Цитата:

Сообщение от bes
Что же это?

HTMLCollection, также известный в DOM-е как ChildNodeList
Он не является массивом, хотя и похож на него.
У него нету некоторых методов массивов(например сортировки, мклейки и иных)
А самое главное, он живой в отличии от массива - если вы возьмете HTMLCollection, то при изменении DOM-модели, он также изменится
Например(запускать на вашем HTML_коде)
var a = document.getElementsByTagName('a');//тоже HTMLCollection
console.log(a.length);//1
console.log(a[0]);//<a href="">
console.log(a[0].innerHTML);//content
document.getElementsByTagName('div')[0].innerHTML = 'qwe';
console.log(a.length);//0
console.log(a[0]);//undefined
console.log(a[0].innerHTML);//Ошибка - элемента уже нет


Цитата:

Сообщение от bes
Причём здесь оператор in и как поместить эту проверку в обработчик события исходного элемента?

Не при чем. Просто таким образом также можно проверить в одну строчку интересующее вас условие.
В одну строчку но, без in
Вы очень хотите использовать именно этот понравившийся вам оператор?

bes 14.04.2012 10:03

Цитата:

Сообщение от Gvozd
Только true все-таки возвращается не event.relatedTarget in this.children, а !(event.relatedTarget in this.children)
event.relatedTarget in this.children возвращает false

Да, здесь я блажанул.

Цитата:

Сообщение от Gvozd
Вы очень хотите использовать именно этот понравившийся вам оператор?

Если работает, почему бы и нет, тем более, что этим удалось бы избежать использование цикла (в который, кстати, я думаю, нужно было ещё добавить и return, чтобы не перебирались элементы после того элемента, на который собственно была наведёна мышь).

Цитата:

Сообщение от Gvozd
HTMLCollection, также известный в DOM-е как ChildNodeList
Он не является массивом, хотя и похож на него.
У него нету некоторых методов массивов(например сортировки, мклейки и иных)

Говорит ли это о том, что псевдомассивы (такие как HTMLCollection) отличаются от массивов только тем, что у них нет некоторых методов массивов?

Правильно ли я понимаю, что псевдомассивы хранят в качестве элементов ссылки на некоторые элементы (через которые собственно можно получить к ним доступ), ведь мы можем обращаться к доступным свойствам этих элементов (например, a[0].innerHTML), хотя приведённый вами пример, Gvozd, вернул строку <a href=""> для a[0] .


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