jQuery: Comment supprimer l’info-bulle tipy?

J’ajoute l’info-bulle tipy aux div avec la classe .placeTaken. L’utilisateur peut alors faire glisser des boîtes, donc je supprime la classe et l’ajoute à une nouvelle div à la place. Lorsque cela se produit, j’ajoute une nouvelle info-bulle ivre à cette div et cela fonctionne bien, mais je veux supprimer l’ancienne.

Ils disent que si vous souhaitez supprimer l’info-bulle en définissant l’atsortingbut title sur une chaîne vide, définissez plutôt l’atsortingbut original-title. J’ai essayé $("#"+dropFromId).attr("original-title", ""); mais l’info-bulle est toujours là. Je ne peux même pas changer le titre de l’info-bulle en définissant un autre titre d’origine.

Qu’est-ce que je fais mal?

Edit: Je suppose que je ne vous ai pas donné suffisamment d’informations. J’utilise ajax pour récupérer les emplacements pris dans la firebase database. PHP retourne un tableau associatif (clients) que j’utilise ensuite dans mon code JavaScript, où la lieu qui se passe correspond à un nom. Les emplacements pris changent lors de la suppression, aussi j’exécute à nouveau la fonction ajax pour mettre à jour le tableau avec tous les emplacements pris. Au poing, j’ajoute l’info-bulle tipy à tous les endroits pris comme

 $("#map div.placeTaken").tipsy({gravity: 'w', html: true, fade: true, title: function(){ // id could for example be map74, subssortingng to 74 var id = $(this).attr("id").subssortingng(3,6); return '
'+customers[id]+'

'; } });

Donc, le titre est égal à ce qui correspond à cet endroit dans le tableau. J’espère que j’explique cela assez bien. Lorsque la boîte est déposée à un nouvel endroit, voici ce qui se passe

 $("#map div span").bind( "dragstop", function(event, ui) { // some code here to change the .placeTaken class // update database with the new place $.ajax({ type: "POST", url: "map.php", data: "dropFromId="+ dropFromId.subssortingng(3,6) +"& dropToId="+ dropToId.subssortingng(3,6), success: function(){ // ajax function to update the js array with new places customerTooltip(); } }); // on this place, add tooltip $("#"+dropToId).tipsy({gravity: 'w', html: true, fade: true, title: // funktion för att avgöra vilken title som ska användas function(){ var id = dropToId.subssortingng(3,6); return '
'+customers[id]+'

'; } }); } });

Tout cela fonctionne bien, alors je pensais que je changerais simplement le titre de dropFromId en “” lors du repository, de sorte que je le supprime.

    Utilisation de $(".tipsy").remove(); semble faire l’affaire, car une div avec une classe tipsy est ajoutée au corps du document lorsque l’info-bulle est affichée.

    Assurez-vous simplement que vous n’utilisez pas de classe tipsy ailleurs (c.-à-d. toolTip plutôt quelque chose comme toolTip votre info-bulle)

    Le moyen le plus simple de supprimer les ivre;

     $('.tipsy:last').remove(); 

    Si vous ne voulez plus que le tipy se montre, utilisez simplement .tipsy('disable') sur l’élément.

    Si vous utilisez sortinggger: manual et que vous souhaitez le masquer, vous pouvez simplement supprimer le .tipsy sur le corps.

    Il y a aussi disable enable et toggleEnabled

     $("#"+dropFromId)[0].setAtsortingbute('original-title', '') 
     $("#tipsyfiedElement").unbind('mouseenter mouseleave'); // Or whatever event sortinggger the tiptool 

    J’ai récemment eu ce problème, voici comment je l’ai résolu:

    Utilisez cette option pour définir l’atsortingbut original-title sur ‘stop’:

     $('.myElement').attr('original-title','stop'); 

    Ensuite, dans jquery.tipsy.js , modifiez le code comme suit:

     ... } else if (typeof opts.title == 'function') { title = opts.title.call(this); } if (title != 'stop') { //line 32 ... ... } //line 62 ... 

    Dans ma version (0.1.7), le code ajouté commence à la ligne 32 et se termine entre crochets à la ligne 62. Tipsy devrait voir que votre atsortingbut title est égal à ‘stop’ et n’essayera pas d’ouvrir l’info-bulle.

    En outre, cela génère une erreur sur la console. Cela ne fait aucune différence, mais si vous voulez vous en débarrasser, ajoutez ceci à la ligne 73 (après avoir ajouté le code précédent)

     try { tip.remove(); } catch(err){} 

    Prisonnier de guerre

    Utilisez: .unbind (‘mouseenter mouseleave’); supprimer une méthode ivre.

    Après avoir consulté Google, nous avons vu cette question après avoir recherché une situation de désactivation de Tipsy sur un appareil mobile en raison de la complexité de l’événement tactile / clic, en particulier sur les iPad.

    La solution que j’ai décidé d’implémenter consistait à append un petit test en haut du fichier jquery.tipsy.js.

    Pour désactiver Tipsy sur les périphériques tactiles (mobiles): var deviceAgent = navigator.userAgent.toLowerCase ();

     var isTouchDevice = Modernizr.touch || (deviceAgent.match(/(iphone|ipod|ipad)/) || deviceAgent.match(/(android)/) || deviceAgent.match(/(iemobile)/) || deviceAgent.match(/iphone/i) || deviceAgent.match(/ipad/i) || deviceAgent.match(/ipod/i) || deviceAgent.match(/blackberry/i) || deviceAgent.match(/bada/i)); function Tipsy(element, options) { this.$element = $(element); this.options = options; this.enabled = !isTouchDevice; this.fixTitle(); }; 

    Voir: Le meilleur moyen de détecter si l’agent utilisateur prend en charge le toucher

    Manière plus simple en utilisant:

     $('body').find('.tipsy').each(function(){ $(this).remove(); });