2010-11-01 10 views
0

J'ai ce moment:jQuery: sur le focus show delbutton

 <td id="delPMicon" style="padding-right:4px;padding:4px;"> 
          ...Removebutton.... 
         </td> 

Ceci est un bouton de suppression dans tous les <tr> (lignes la base de données crachera sur, utilisés while() en PHP).

Tous les <tr> a un identifiant #pm pour le moment.

Je voudrais quand vous vous concentrez avec votre souris/marque avec votre souris, sur le <tr> le #delPMicon devrait apparaître, puis disparaître surblur.

J'ai essayé:

added css property to #delPMicon: display:none; and then: 
$('#pm').focus(function() { 
    $('#delPMicon').show(); 
}); 

Cela ne fonctionne pas, ne savent pas ce que je fait de mal.

Je sais aussi que id ne peut être utilisé qu'une seule fois, donc le focus #pm ne fonctionnera que sur un <tr> (si cela a fonctionné correctement), comment puis-je résoudre ce problème? Je ne peux pas utiliser la classe au <tr>, comme je l'utilise pour une autre fonction. Ce que je peux faire (ce que je peux penser) est d'ajouter l'id de la ligne à la #pm, donc ce serait: # pm22, mais alors comment puis-je dire au JS quel id il devrait soigner?

Ou peut-être que je peux ajouter cette fonction .focus à chaque B dans la boucle while afin d'obtenir les ids, donc je pouvais faire:

$('#pm<?php echo $id; ?>').focus(function() { 

Répondre

1

Essayez cette

$('.pm').hover(function() { 
    function() { $(this).find('.delPMicon').show(); }, 
    function() { $(this).find('.delPMicon').hide(); } 
}); 

Vous pouvez utiliser la même classe pour tous les éléments qui ont actuellement le même identifiant. Utilisez ensuite la référence 'this' pour attacher un gestionnaire d'événements à chacun individuellement.

+0

je name = au lieu, mais accepté pour le vol stationnaire(); – Johnson

+1

Les paramètres de hover ne doivent pas être: hover (function() {...}, function() {...}); Le premier paramètre est ce qui se passe lorsque votre souris entre dans la zone au-dessus du sélecteur, et le deuxième paramètre est ce qui se passe lorsque votre souris quitte la zone sur le sélecteur. – tinifni

+0

Merci tinifni. –

0

Il suffit d'utiliser CSS

tr > td#delPMIcon { display: none; } 
tr:hover > td#delPMIcon { display: table-cell; }