jquery: cacher l'attribut du titre mais ne pas l'enlever

Question

J'ai vu que la plupart des gens le feraient avec cette solution que sur la souris, nous récupérerons la valeur dans l'attribut TITLE, puis retirerons sa valeur. Pendant la sortie de la souris, nous le remettrons en marche.

$(this).attr('title',''); 

ou

$(this).removeAttr('title'); 

Je veux savoir est-il possible que cacher l'info-bulle d'apparaître que de supprimer l'attribut title?

merci!

Answer 1

Non, vous ne pouvez pas, car le navigateur va décider quoi faire avec l'attribut de titre. Vous pouvez toutefois enregistrer avec le noeud pour référence ultérieure (et peut-être restaurer le titre):

$(this).data("title", $(this).attr("title")).removeAttr("title"); 

Answer 2

Vous pouvez enregistrer le titre ailleurs alors que la souris est sur l'élément. Vous n'avez pas à le stocker dans le DOM lui-même, cependant; vous pourriez le garder dans un JS var:

(function(){ 
    var ttext; 
    $(yourtargetselectorhere).hover(function(){ 
    ttext = $(this).attr('title'); 
    $(this).removeAttr('title'); 
    }, 
    function(){ 
    $(this).attr('title', ttext); 
    }); 
}()); 

Answer 3

peur que vous ne pouvez pas. La méthode preventDefault() ne semble pas fonctionner pour cela, ce qui est regrettable car ce serait idéal.

Si vous avez vraiment besoin de conserver le titre attribut que vous pouvez faire quelque chose comme ceci:

$(document).ready(function(){ 
     $("a").hover(function(){ 

     // Get the current title 
     var title = $(this).attr("title"); 

     // Store it in a temporary attribute 
     $(this).attr("tmp_title", title); 

     // Set the title to nothing so we don't see the tooltips 
     $(this).attr("title",""); 
     }, 

     function() { // Fired when we leave the element 

     // Retrieve the title from the temporary attribute 
     var title = $(this).attr("tmp_title"); 

     // Return the title to what it was 
     $(this).attr("title", title); 
     }); 
}); 

Il est assez alambiquée bien. À moins qu'il y ait une raison particulière pour laquelle vous devez conserver les attributs du titre, je voudrais simplement les supprimer.

Answer 4

merci pour votre solution. J'ai eu le même problème dans un projet. Le problème était un long titre laid apparaissait lorsque je survolais l'image et j'avais besoin du titre en popup parce que dans l'attribut title, je place un lien d'achat vers un produit. mais comme je l'ai dit, un long titre qui inclut un tag apparaissait aussi en vol stationnaire. donc je viens d'ajouter une fonction .click à la fin de votre solution, je ne sais pas s'il est possible de résoudre cela d'une manière plus sémantique, puisque je ne suis pas un expert en jquery. le script complet est collé ci-dessous, ce qui a trait :)

$(".collection-box a").hover(function(){ 

    // Get the current title 
    var title = $(this).attr("title"); 

    // Store it in a temporary attribute 
    $(this).attr("tmp_title", title); 

    // Set the title to nothing so we don't see the tooltips 
    $(this).attr("title",""); 
    }, 

    function() { // Fired when we leave the element 

    // Retrieve the title from the temporary attribute 
    var title = $(this).attr("tmp_title"); 

    // Return the title to what it was 
    $(this).attr("title", title); 
    }); 


    //Restore the title on click 
    $(".collection-box a").click(function(){ 

    // Retrieve the title from the temporary attribute 
    var title = $(this).attr("tmp_title"); 

    // Return the title to what it was 
    $(this).attr("title", title); 
    }); 

Answer 5

Voici une bonne solution, nommez un nouvel attribut dire 'fancytitle' à la place de l'habituel 'titre' comme celui-ci

<a href='#' customtitle='visit google' id='demo'> Visit Google Search </a> 

Et choisir valeur de l'attribut avec jquery sur mouseenter/hover comme ceci

$('a#demo').attr('fancytitle') 

Answer 6

Cela fonctionne.

$(document).ready(function(){ 
 
     $("a") 
 
     \t .mouseenter(function() { \t 
 
     \t \t var title = $(this).attr("title"); 
 
     \t \t $(this).attr("tmp_title", title); 
 
     \t \t $(this).attr("title",""); 
 
     \t }) 
 
     \t .mouseleave(function() { 
 
     \t \t var title = $(this).attr("tmp_title"); 
 
     \t \t $(this).attr("title", title); 
 
     \t }) 
 
     \t .click(function() { \t 
 
     \t \t var title = $(this).attr("tmp_title"); 
 
     \t \t $(this).attr("title", title); 
 
     \t }); 
 
     }); 
 
     });