JQuery Tooltip funktioniert nicht wie erwartet

Question

Hier ist der jQuery-Code für einen Tooltip Popup, wenn ich schweben über einen Link.

Fehler ist, wenn ich schweben über sie, es Titel nichts Sätze zeigen es zeigen einmal und dann wird nichts kommen, wenn ich den Mauszeiger über sie wieder.

Wenn ich this.title = entfernen ""; es funktioniert, aber der Link-Titel kommt aswell

HTML

 < a href="#" class="tooltip" title="Name< br>Test">ToolTip< /a>

JQUERY

 this.tooltip = function(){ 

    xOffset = 10;
    yOffset = 20;               

$("a.tooltip").hover(function(e){                                             
    this.t = this.title;
    this.title = "";                                          
    $("body").append("<p id='tooltip'>"+ this.t +"</p>");
    $("#tooltip")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px")
        .fadeIn("fast");        
},
function(){
    this.title = this.t;        
    $("#tooltip").remove();
}); 
$("a.tooltip").mousemove(function(e){
    $("#tooltip")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px");
});         

};

Answer 1

Sie wollen eine Prüfung durchzuführen, wenn der Titel zunächst leer ist. Der Grund dafür ist, weil Sie blind die t Variable, egal was und Löschen der Titeleinstellung sind. Versuchen Sie folgendes:

this.tooltip = function(){ 
    xOffset = 10;
    yOffset = 20;

    $("a.tooltip").hover(function(e){
        if(this.t === undefined || this.t.length == 0) {

           this.t = this.title;
           this.title = "";
        }
        $("body").append("<p id='tooltip'>"+ this.t +"</p>");
        $("#tooltip")
                .css("top",(e.pageY - xOffset) + "px")
                .css("left",(e.pageX + yOffset) + "px")
                .fadeIn("fast");
    }, function(){
        this.title = this.t;
        $("#tooltip").remove();
    }); 
    $("a.tooltip").mousemove(function(e){
        $("#tooltip")
                .css("top",(e.pageY - xOffset) + "px")
                .css("left",(e.pageX + yOffset) + "px");
});