Проблема несовместимости JQuery (вероятно) в Firefox. Работа в Chrome - PullRequest
Новая
       23

Проблема несовместимости JQuery (вероятно) в Firefox. Работа в Chrome

0 голосов
/ 19 июля 2010 
<tr onmouseover="$('#actions').show();" onmouseout="$('#actions').hide();" >
    <td>
        <a onclick="showContacts();">Group Name</a>
    </td>
    <td>
        <span id="actions" style="display:none;">
            <img src="../images/Delete-icon.png" onclick="del();"/>
            <img src="../images/add-16.png" onclick="loadpage('contacts.php');" />
            <img src="../images/mail.png" onclick="send();" />
        </span>
    </td>
</tr>

Это мой код. Я пытаюсь показать 3 изображения во втором <td>, когда <tr> завис. Изображения появляются при наведении на текст в первом <td>, но исчезают, когда мышь покидает текст. Это происходит только в моем FF (v3.6), но отлично работает в IE и Chrome. Может кто-нибудь помочь мне решить эту проблему, пожалуйста?

Ответы [ 2 ]

5 голосов
/ 19 июля 2010

Скорее всего, потому что, как только курсор покидает элемент td с текстом, возникает событие mouseout, всплывающее до родительского элемента tr и обрабатываемое там.

Doэто способ jQuery, не прикрепляйте обработчики событий в вашем HTML-коде. 

$(function() {
    $('tr').hover(function() { // <- select the right tr here, by e.g. giving it an ID
        $('#actions').toggle();
    });
}

Ссылки: .hover(), .toggle()

То же самое для других элементов.Ваш код будет чище, потому что представление (HTML code) и логика (JavaScript) разделены.

Также обратите внимание, что идентификаторы должны быть уникальными в документе HTML, поэтому у вас не может быть другого элемента сID action.Я говорю это потому, что, поскольку ваш код показывает строку таблицы, похоже, что у вас есть другие строки с элементом #action.Если это так, сделайте его классом и соответствующим образом настройте селекторы.

1 голос
/ 19 июля 2010

Приходите на яркую сияющую дорогу ненавязчивый javascript . У всех нас есть баллоны и все такое, это так весело! :)

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

...