2010-08-10 15 views
13

Agrego el tipsy tipsy tips a los divs con la clase .placeTaken. El usuario puede arrastrar cuadros hacia allí, así que elimino la clase y la agrego a un nuevo div en su lugar. Cuando esto sucede, agrego un nuevo tipsy tooltip a ese div y funciona bien, pero quiero eliminar el viejo.jQuery: cómo eliminar la información sobre herramientas tipsy?

Dicen que si desea eliminar la información sobre herramientas estableciendo el atributo de título en una cadena vacía, establezca en su lugar el atributo original-título. Intenté $("#"+dropFromId).attr("original-title", ""); pero la información sobre herramientas todavía está allí. Ni siquiera puedo cambiar el título de la información sobre herramientas configurando otro título original.

¿Qué estoy haciendo mal?

Editar: Creo que no les di suficiente información. Uso ajax para tomar los lugares que se toman de la base de datos. El PHP devuelve una matriz asociativa (clientes) que luego uso en mi JavaScript donde el lugar tomado coincide con un nombre. Los lugares que se toman cambian al caer, por lo que realizo la función ajax nuevamente para actualizar la matriz con todos los lugares tomados. En verdadera, agrego la información sobre herramientas borracho a todos los lugares tomados como tal

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

Así que el título es igual a lo que coincide con ese lugar en la matriz. Espero estar explicando esto lo suficientemente bien. Cuando la caja se deja caer en un nuevo lugar, esto es lo que sucede

$("#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.substring(3,6) +"& dropToId="+ dropToId.substring(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.substring(3,6); 
       return '<div>'+customers[id]+'</div><br />'; 
      } 
     }); 
    } 
}); 

Todo esto funciona bien, así que pensé que me gustaría simplemente cambiar el título dropFromId a "" en la caída, por lo que lo quito .

+0

¿Puede dar algunos ejemplos de código que muestra el problema? –

+0

También debe publicar su html ya que la información sobre herramientas proviene del atributo 'title' a menos que esté usando algún atributo personalizado. – Sarfraz

+0

Ok, publiqué un código. – Charles

Respuesta

2
$("#"+dropFromId)[0].setAttribute('original-title', '') 
+0

Esto es correcto, y es el método sugerido por el autor de achispado en: http://onehackoranother.com/projects/jquery/tipsy/#options – Sam

1
$("#tipsyfiedElement").unbind('mouseenter mouseleave'); // Or whatever event trigger the tiptool 
26

Usando $(".tipsy").remove(); parece hacer el truco desde un div con una clase tipsy se añade al cuerpo del documento cuando se muestra la información sobre herramientas.

Sólo asegúrese de que usted no utiliza una clase tipsy en otro lugar (es decir, llamar a algo de su información sobre herramientas como toolTip lugar)

0

Recientemente tuve este problema, aquí es cómo lo resolví:

Se utiliza para fijar el atributo original del título de 'stop':

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

Luego, en jquery.tipsy.js, cambie el código a la siguiente:

En mi versión (0.1.7) el código agregado comienza en la línea 32 y termina en la línea 62. Tipsy debería ver que su atributo de título es igual a 'stop' y no intentará abrir la información sobre herramientas.

Además, esto escupe algún error en la consola. No hace ninguna diferencia, pero si usted quiere deshacerse de ella, poner esto en la línea 73 (después de añadir código anterior)

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

prisioneros

11

La forma más sencilla de eliminar borracho;

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

Muy útil si tiene un botón con tipsy asignado, botón de mouse excesivo → tipsy tooltip aparece, luego haz clic en el botón, el tipsy queda oculto por el código anterior. ¡Gracias! –

5

Si no desea que el borracho para mostrar más .tipsy('disable') sólo tiene que utilizar en el elemento.

Si está utilizando trigger: manual y desea ocultarlo, puede eliminar el .tipsy div en el cuerpo.

También hay disableenable y toggleEnabled

0

Uso: .unbind ('MouseEnter mouseleave'); para eliminar un método borracho.

0

Vi esta pregunta después de buscar en Google una situación para desactivar Tipsy cuando estaba en un dispositivo móvil debido a las complejidades con el evento táctil/clic, específicamente en iPads.

La solución que decidí implementar fue agregar una pequeña prueba en la parte superior del archivo jquery.tipsy.js.

Para deshabilitar Tipsy en dispositivos táctiles (móviles): 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(); 
}; 

See: The best way to detect if user agent supports touch

0

manera más fácil im usando:

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