jQuery: временно удалить атрибут TITLE элемента на HOVER - PullRequest
Новая
       43

jQuery: временно удалить атрибут TITLE элемента на HOVER

1 голос
/ 11 февраля 2012

Я создал всплывающие подсказки, чтобы заменить пузырёк «НАЗВАНИЕ» браузера по умолчанию.Я прочитал много тем, и все они предлагают мне временно удалить title на mouseover и снова включить его позже.Я пытаюсь сделать это точно, но у меня ничего не получается.Вот мой код, и причина, по которой я использую jQuery live, заключается в том, что я хочу, чтобы эффект применялся к динамически добавляемым элементам позже: 

tooltip : {
    activate : function(selector){
        $(selector).each(function(){
            $(selector).live('mouseover',function(e){
                tooltip.init(this,true,e);
            });
            $(selector).live('mouseout',function(e){
            tooltip.init(this,false,e);
            });
        });
    },
    init : function(elem,show,e){
        var title = $(elem).attr('title');
        this.addTip(elem,show,title);

        ...
    },
    addTip : function(elem,show,title) {
        var code = '<div class="tooltip-wrapper">'+title+'</div>';
        if(show) {
            $(elem).after(code);
            setTimeout('$(".tooltip-wrapper").fadeIn("slow")',500);
        }
        else {
            $(".tooltip-wrapper").remove();
        }
    }
}

Я называю этот сценарий так:

Другая проблема, с которой я столкнулся, заключается в том, что при попытке указать tooltip.activate("*"); возникает ошибка HIERARCHY_REQUEST_ERR: DOM Exception 3, но она работает, если в качестве селектора используется input.

Любые входные данные будут высоко оценены-)

Ответы [ 2 ]

1 голос
/ 11 февраля 2012

как насчет этого? 

addTip : function(elem,show,title) {
        var code = '<div class="tooltip-wrapper">'+title+'</div>';
        if(show) {

            $(elem).after(code);
            $(elem).removeAttr('title');
            setTimeout('$(".tooltip-wrapper").fadeIn("slow")',500);
        }
        else {
            $(".tooltip-wrapper").remove();
            $(elem).attr('title',title);
        }
    }
1 голос
/ 11 февраля 2012

Я просто укажу на пару вопросов:

  • Использование live внутри each опровергает идею live.each зацикливает существующие элементы, а не будущие элементы.
  • Но в любом случае, то, как вы это делаете, неверно.Вы должны удалить each (в activate), потому что live уже применяется к нескольким элементам.Так что в вашем случае, если у вас есть N элементов, вы будете добавлять один и тот же прослушиватель событий N раз.
  • * применяется ко всем элементам, что может быть очень неэффективно.Как насчет попытки [title] (применяется к элементам, которые имеют атрибут title)
  • Если вы временно удалите заголовок при наведении, тогда заголовок не имеет смысла (потому что он появляется только при наведении).Если вы создаете улучшенную подсказку на основе атрибута заголовка, просто прочитайте атрибут заголовка при первом обращении к нему и используйте его для подсказки
  • Возможно, вы должны использовать mouseenter и mouseleave вместо mouseover и mouseout.Если элемент с заголовком имеет дочерние элементы, вы хотите, чтобы всплывающая подсказка продолжала отображаться, когда указатель мыши вводит / выводит дочерние элементы.
...