[HTML/JS] link achter row

[Stalkert]

Stel: ik heb een simpele tabel met 3 kolommen en 10 rijen. Is het mogelijk om een link achter een rij te hangen? Volgens mij gaat het niet met HTML alleen. Iemand een idee hoe ik dit kan oplossen?
Ik zelf had al gedacht om om elke rij een div te zetten en achter een div een link te hangen, maar ik krijg dit ook niet voor elkaar. Zijn er andere/betere manieren?

[Janoz]

Als je om de inhoud van een cel nu gewoon eens een link zet (a). Vervolgens geef je met je stylesheet op dat de width en height 100% worden (eventueel display op block oid)

[Stalkert]

Dan geldt het toch alleen maar voor 1 cel en niet voor een rij. Begrijp ik je verkeerd of moet ik dit voor alle cellen toepassen?

[Verwijderd]

Waarom geen 4e kolom voor de links

edit:
verkeerd begrepen

HTML:

<tr onclick="location.href='mijnlink.html'">
   <td>...</td>
   <td>...</td>
   <td>...</td>
</tr>

[ Voor 68% gewijzigd door Verwijderd op 04-04-2007 22:17 ]

[Stalkert]

precies wat ik zocht, weer wat geleerd. thx!

[Joolee]

Ik heb zelf een javascriptje dat door alle TR's in alle TBODY tags zoekt. Daarna kijkt hij of er een anchor met class 'main' in staat. Als dat zo is krijgt de TR een mouseover en onclick event mee.
Er zijn vast efficiëntere scripts maar dit kon ik zelf maken

JavaScript:

function stripe() {
    
    var tables = document.getElementsByTagName('table');
            var z=0;

    for ( var i = 0; i < tables.length; i++ ) {

        if(!hasClass(tables[i], 'list'))
            continue;
        
        var table = tables[i];
        var rows = table.tBodies[0].rows;
        for ( var y = 0; y < rows.length; y++ ) {
            var row = rows[y];

            if(row.getElementsByTagName('table').length > 0) {
                continue;
            }
            z++;
            if(z % 2 == 0)
                addClass(row, 'even');
            else
                addClass(row, 'odd');
            
            row.onmouseover = function() {addClass(this, 'hover')};
            row.onmouseout = function() {removeClass(this, 'hover')};
            row.onclick = function() {
                var anchors = this.getElementsByTagName('a');
                for ( var a = 0; a < anchors.length; a++ ) {
                    if(anchors[a].className == 'main') {
                        jumpTo(anchors[a].href);
                        break;                  
                    }       
                } //for
            } //function
        } //for
    } //for
} //function

Plus een paar functies die erin aangeroepen worden (niet zelf gemaakt):

JavaScript:

function hasClass(node, className) {
  if (node.className == className) {
    return true;
  }
  var reg = new RegExp('(^| )' + className + '($| )')
  if (reg.test(node.className)) {
    return true;
  }
  return false;
}

function addClass(node, className) {
  if (hasClass(node, className)) {
    return false;
  }
  node.className += ' ' + className;
  return true;
}

function removeClass(node, className) {
  if (!hasClass(node, className)) {
    return false;
  }
  node.className = eregReplace('(^| )' + className +'($| )', '', node.className);
  return true;
}

function toggleClass(node, className) {
  if (!removeClass(node, className) && !addClass(node, className)) {
    return false;
  }
  return true;
}