Hvordan lage HTML tabellceller Klikkbart

Museklikk tillate mennesker og datamaskiner til å kommunisere. Klikk på en link eller en knapp og datamaskinen svarer. HTML-tabeller som vises på websider ofte består av statiske data som presenteres til besøkende i et tabellformat. Hvis noen klikker på en tabellcelle, skjer noen ganger ingenting. Ved å legge en kort Javascript-funksjonen på din side, kan du slå hvilken som helst tabell celle til en lenke som lanserer en annen nettside eller utfører en annen handling ..

Bruksanvisning

1 Start din HTML editor eller Notisblokk og åpne et HTML-dokument.

2 Lim inn koden nedenfor inn i dokumentet:

<Table class = "style2">
<Tr>

<Td>
regelmessig celle
</ Td>

<Td>
regelmessig celle
</ Td>
</ Tr>

<Tr>
<Td>
<a href="http://www.whitehouse.gov&quot;> Klikk for å besøke Det hvite hus
</a>
</ Td>

<Td>
<a href="#" onclick="javascript: alert('You klikket denne tabellen cell')">
Klikk for å kjøre en Javascript-funksjon
</a>
</ Td>

</ Tr>
</ Table>

Denne koden lager en tabell som inneholder to rekker og to kolonner. De "td" tags definere tabellen celle. Alt mellom disse cellene blir en del av cellen. Legg merke til de to ankerkoder som vises på de to siste celler. Den første anker er "href" attributt poeng til Det hvite hus nettstedet. Den neste ankerkoden legger til en "onclick" event til ankeret. Denne hendelsen krever Javascript varselsfunksjon.

3 Lagre HTML-dokumentet og åpne den i alle nettlesere. Tabellen vises. Flytt musepekeren over tabellcellene. Markøren endres til en peker når den beveger seg over de to siste cellene i tabellen.

4 Klikk på "Klikk for å besøke Det hvite hus" linken. Nettleseren din navigerer til Det hvite hus nettstedet. Klikk på "Klikk for å kjøre en Javascript-funksjon" linken. Varslingsfunksjonen går og viser en pop-up meldingsboks.

Hint

  • Legg en ankerkode til noen tabellcelle som du trenger for å lage klikkbare. Dette eksemplet viser ringer Javavarselsfunksjon. Erstatt den funksjonen med noen funksjon i koden din. For eksempel kan du plassere en link i en tabellcelle som kaller en funksjon som heter "Vis produkter". Denne funksjonen kan vise et pop-up vindu som inneholder produkter når brukere klikker på tabellcelle.