jQuery: Почему в мире этот элемент не будет прятаться при наведении? - PullRequest
1 голос
/ 13 декабря 2010

Это действительно расстраивает сейчас!

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

$('#userBubble').mouseover(function() {
    $(this).hide();
});

Теперь, что-то не так с этим? Вместо этого я попытался использовать mouseenter, но с этим тоже не повезло. Я также попытался поместить его в функцию $ (document) .ready () - и там тоже не повезло. #userBubble - это контейнер содержимого, загружаемого при наведении, и имя является правильным. Я могу console.log #userBubble, поэтому он действительно существует.

Есть идеи, что все это портит? Я не получаю ошибок, это просто не работает.

Ответы [ 6 ]

2 голосов
/ 13 декабря 2010

Это, вероятно, потому что элемент еще не существует, когда вы добавляете обработчик.Попробуйте

$('#userBubble').live('mouseover', function() {
   $(this).hide();
});

вместо.

2 голосов
/ 13 декабря 2010

Убедитесь, что идентификатор пользователя является уникальным в DOM и что элемент существует, когда вы связываете (или используете live).

Измени его на класс и используй вживую. Могу поспорить, это работает.

<img id="userBubble" class="userBubble"/>

$('.userBubble').live("mouseover", function() {
    $(this).hide();
});
0 голосов
/ 13 декабря 2010

Следующее должно работать.


$(document).ready( function()
{
    $("#hoverHide").mouseover( function ()
    {
        $(this).hide();
    } );
} );

Если это не сработает, попробуйте это:


$(document).ready( function()
{
    $("#hoverHide").mouseover( function ()
    {
        $("#hoverHide").hide();
    } );
} );

Если ни один из этих способов не работает, вероятно, у вас есть синтаксисошибка где-то на вашей странице.Возможно, в объявлении функции .ready.

0 голосов
/ 13 декабря 2010

Работал с парением

$('#userBubble').hover(function() {
    $(this).hide();
});

http://jsfiddle.net/2n2kJ/

0 голосов
/ 13 декабря 2010

перед установкой события убедитесь, что вы загрузили html-div:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#test').mouseover(function () { $(this).hide(); })
        });
    </script>
</head>
<body>
    <div id="test">This will hide!</div>
</body>
</html>
0 голосов
/ 13 декабря 2010

Вы пробовали это?

$('#userBubble').mouseover(function(event) {

        $(event.target).hide();

});

РЕДАКТИРОВАТЬ: Ohw, не совсем прочитал ваш вопрос хорошо.или делегат;)

...