jQuery $ (this) .tagName возвращает «HTML» - PullRequest
1 голос
/ 07 апреля 2011

У меня есть этот код jQuery:

    $('*').mouseover(function() 
    {
        $('#log').text($(this)[0].tagName);
    });

И на моей странице у меня есть куча элементов и DIV с идентификатором "log". Когда пользователь наведет курсор мыши на любой из элементов, я хочу, чтобы его имя элемента (например, p или h2) появилось в #log. Но всякий раз, когда я наводю курсор мыши на что-либо, он возвращает HTML. Как мне это исправить?

Ответы [ 7 ]

6 голосов
/ 07 апреля 2011

Попробуйте:

$('*').mouseover(function(evt) 
{
    $('#log').text($(this)[0].tagName);

    evt.stopPropagation();
});

Ваша проблема, я думаю, заключается в том, что событие распространяется по цепочке до тех пор, пока оно не достигнет <html>, и на этом оно останавливается.Это должно помочь.

РЕДАКТИРОВАТЬ: Это может также помочь сузить область, то есть $('#container > *').

2 голосов
/ 07 апреля 2011

Попробуйте это:

$('*').bind('mouseover', function(e) {
    e.stopPropagation();
    $('#log').text($(this)[0].tagName);
}
2 голосов
/ 07 апреля 2011

Это потому, что все события всплывают до html, где они обрабатываются.

Попробуйте это ...

$(document).mouseover(function(event) {
   $('#log').text(event.target.tagName);
});

Теперь вы прикрепляете только одно событие, ипусть они все всплывают до document, где они будут обрабатываться.

1 голос
/ 07 апреля 2011

Проблема в том, что ваше событие пузырится до узла html dom ... вы этого не хотите. Это исправит это:

$('*').mouseover(function(e){
  e.stopPropagation();
  $('#log').text(this.tagName);
});
0 голосов
/ 07 апреля 2011

Я создал Fiddle, чтобы помочь вам: http://jsfiddle.net/ErickPetru/NQfZh/

Как видите, я предлагаю вам использовать mouseenter insted, тогда распространение событий не будет проблемой.Если вы используете mouseover, мышь будет все время запускать это событие для каждого элемента и их родителей.

Кроме того, .attr("tagName") лучше, потому что вам не нужен индекс [0].

0 голосов
/ 07 апреля 2011

Вы подключаете этот обработчик событий к любому элементу DOM, выбирая «*».Без event.stoppropagation () ... каждое действие направляется вниз (вверх!) К html.

try

$('*', 'body').mouseover(function() 
{
    $('#log').text($(this)[0].tagName);
});

, что ограничивает обнаружение тегов элементами, содержащимися в теле.

0 голосов
/ 07 апреля 2011

первым элементом документа является тег html.Таким образом, он получит первую команду наведения.Посмотрите - по крайней мере, - для элемента тела.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...