2011-02-14 17 views
32

¿Puede alguien darme un ejemplo de agregar una información sobre herramientas cada vez que cierro un td en un table.Cómo agregar información sobre herramientas a td en una tabla

El contenido de la información sobre herramientas debe provenir de los registros de la base de datos.

Ejemplo:

Si se ciernen Un nombre en una mesa .. la descripción debe mostrar su/su información.

+4

Como demuestra la respuesta de @Shaz, jQuery (ya que ha etiquetado la pregunta) no es necesario para esto. El atributo del elemento 'title' debería hacer el trabajo bien. ¿A menos que necesite más funcionalidad desde la información sobre herramientas? En cuanto al acceso a la base de datos, eso es todo del lado del servidor y se haría sin embargo, normalmente se accede a la base de datos en esta configuración. – David

Respuesta

4
<?php 
    $test = "Test" 
?> 


<table> 
    <tr> 
     <td title="<?php echo $test; ?>">Hi there</td> 
    </tr> 
</table> 
+3

¿Olvidaste el eco? –

32

utilizar el atributo title:

<table> 
    <tr> 
     <td> 
      <a href="#" title="John Smith lives in New York."> John Smith </a> 
     </td> 
    </tr> 
</table> 

en vivo de demostración:http://jsfiddle.net/GpU5f/

27

Usted obtendrá una información sobre herramientas en vuelo estacionario si se agrega 'título = "lo que sea "' A la <td>:

<tr><td title="whatever">hover here to see "whatever" in a tooltip</td> 

Cuando el contenido de título proviene es una historia diferente y quizás más difícil, pero tal vez usted puede organizar el código del programa que está proporcionando innerText de la célula para hacer lo mismo para la célula de title=....

HTH

- Pete

2

ya que la pregunta original fue etiquetada jQuery y ninguno de los ejemplos mencionar esto (por trivial), es sólo una cuestión de

$(tdSelector).attr('title', titleText);

0

En angular.js puede funcionar así: -

<table> 
<tr ng-repeat="data in list"> 
<td class="table-text-right tooltip-enable-mandatory" data-toggle="tooltip" data-container="#tableRoceMovement"data-original-title="{{data.value}}" title="{{data.value}}"data-placement="bottom" data-html="true" onmouseenter="tooltipEnterEvent($(this))" onmouseleave="tooltipLeaveEvent($(this))">{{data.value}}</td> 
</tr> 
</table> 
Cuestiones relacionadas