Prototype Element.toggle при наведении, отключает с помощью childElements - PullRequest
Новая
       15

Prototype Element.toggle при наведении, отключает с помощью childElements

3 голосов
/ 21 июля 2009

У меня сложилась следующая ситуация:

Я получил такую ​​структуру таблицы: 

<tr>
  <td>text</td>
  <td>text</td>
  <td>text</td>
  <td><a href="#"><img src="#" /></td>
  <td><span style="display:hidden"><a href="#">e</a> <a href="#">e</a></td>
</tr>

То, что я делаю со следующей функцией, отображает скрытый диапазон при наведении курсора на строку таблицы. Однако это извращает всякий раз, когда я нахожу дочерние элементы внутри tr: привязанное изображение и сам промежуток. Как я могу это исправить? 

// Reveal item options on hover
$$('#financedata tr').invoke('observe', 'mouseover', function(event) {
    event.target.up().childElements()[4].childElements()[0].toggle();                   
}); 
$$('#financedata tr').invoke('observe', 'mouseout', function(event) {
    event.target.up().childElements()[4].childElements()[0].toggle();
});

1 Ответ

5 голосов
/ 21 июля 2009

Попробуйте следующее: 

$$('#financedata tr').invoke('observe', 'mouseout', function(event) {
    this.up('tbody').childElements()[4].childElements()[0].toggle();
});

Ключ использует "это". В Prototype «this» всегда будет элементом, с которым связано событие, тогда как event.target (который не следует использовать, поскольку он не является кросс-браузерным) и event.findElement () будут фактическим элементом, к которому относится событие произошло на. .Up ('tbody') - это просто личное предпочтение, которое гарантирует, что вы выбираете родительское tbody и ничего больше. Попробуйте с или без.

Читайте: http://www.prototypejs.org/api/event/observe для получения дополнительной информации и примеров того, как работает всплывающее окно событий.

...