Lien de toute la ligne de la table?
Je sais qu'il est possible de lier l'ensemble d'une cellule de tableau avec les CSS.
.tableClass td a{
display: block;
}
Est-il un moyen pour appliquer un lien vers l'intégralité d'une ligne de tableau?
- double possible de comment faire une ligne dans une table cliquable comme un lien?
Vous devez vous connecter pour publier un commentaire.
Je suis d'accord avec Matti. Il serait facile de le faire avec un simple javascript. Un rapide jquery exemple serait quelque chose comme ceci:
et
puis dans votre CSS
<a href="...">
toutes les valeurs de la table.Malheureusement, non. Pas de HTML et CSS. Vous avez besoin d'un
a
élément pour faire un lien, et vous ne pouvez pas vous envelopper toute une ligne de la table dans une.Le plus proche que vous pouvez obtenir est de relier chaque cellule du tableau. Personnellement, j'avais juste un lien entre une cellule et utiliser JavaScript pour le reste cliquable. Il est bon d'avoir au moins une cellule qui ressemble vraiment à un lien, a souligné toutes et à tous, pour plus de clarté, de toute façon.
Voici un jQuery simple fragment de code à faire toutes les lignes de la table avec des liens cliquables (il semble pour le premier lien et "clics" c')
tr
,delegate
est beaucoup plus efficace que l'utilisationlive
live
juste attache un gestionnaire d'événement sur le niveau du document et qui s'occupe de tout. Maintenant,live
pouvez obtenir inefficace si vous avez beaucoup de les gestionnaires, parce qu'on va tous être traitées pour l'essentiel, tous les événements du type, mais le nombre d'éléments doit pas faire de différence.delegate
est attaché à latable
élément, et les événements seulement besoin de faire des bulles grâce à un élémentUtiliser le
::before
pseudo-élément. De cette façon, vous n'avez pas à traiter avec Javascript ou la création de liens pour chaque cellule. À l'aide de la suite detable
structuretout ce que nous avons à faire est de créer un élément de type block qui couvre toute la largeur de la table à l'aide de
::before
sur le lien désiré (.rowlink
) dans ce cas.démo
La
::before
est mis en évidence en rouge dans la démo, donc vous pouvez voir ce qu'il fait.td
avecpadding-top
?margin-top
à.rowlink::before
égale à lapadding-top
detd
a fonctionné pour moi.Exemple: http://xxjjnn.com/linktablerow.html
Lien de toute la ligne:
Le forum que vous préférez le mettre en surbrillance sur la souris pour l'ensemble de la ligne, puis:
avec quelque chose comme ce qui suit pour le css, qui permettra d'éliminer l'écart entre les cellules d'un tableau et modifier l'arrière-plan sur le vol stationnaire:
Iff que vous êtes à l'aide de Rails 3.0.9 alors vous pourriez trouver cet exemple de code utile:
De la mer a beaucoup de Poissons, le Poisson a de nombreuses Échelles, ici est extrait de l'app/view/poisson/index.erb
avec @fishies et @mer sont définis dans app/controllers/seas_controller.rb
:hover
pourrait être omis, ou vous pouvez même le style inline, comme<tr style="cursor:pointer" onclick="location.href='url'">
Aussi cela dépend de si vous avez besoin d'utiliser un élément de tableau ou pas. Vous pouvez imiter une table à l'aide de CSS et de faire un Un élément de la ligne
css:
Je me sens comme la solution la plus simple est sans javascript et tout simplement de mettre le lien dans chaque cellule (à condition que vous n'avez pas massive des ravines entre vos cellules ou pensez vraiment que des lignes frontalières). Votre css:
puis ajouter un lien par cellule:
ennuyeux, mais propre.
De lier l'ensemble de la ligne, vous devez définir
onclick
fonction sur votre ligne, ce qui est<tr>
élément et de définir une sourishover
dans le CSS pourtr
élément pour faire le pointeur de la souris à un type de sur-main dans le web:Dans le tableau:
Connexes CSS: