[JS] Meerder td's weer op wit zetten

[stean]

ik heb de volgende code

code:

<script language="JavaScript">
function checkit(tObj)
{
                document.form.dnd.td.style.bgcolor='white';
                tObj.bgColor='E7E5E5';
    tObj.style.color='black';
}
</script>
<form name="dnd">
<td onClick="checkit(this)" style="cursor:hand">eerste</td>
<td onClick="checkit(this)" style="cursor:hand">tweede</td>
<td onClick="checkit(this)" style="cursor:hand">derde</td>
</form>

Nu als ik voor de eerste keer op een item klik wordt die mooi lichtgrijs(de achtergrond). Echter ik wil dat als ik op een ander item klik, alle items weer wit worden en dan de gene die ik heb aangeklikt wit maakt.

Hoe doe ik dat correct?
(deze regel document.form.dnd.td.style.bgcolor='white'; gaat dus nu fout)

[Pelle]

Ik begrijp d'r helemaal geen hol van.

[stean]

NU wel?

[RM-rf]

code:

document.form.dnd.td.style.bgcolor='white'

wat denk je daar te doen?

volgens mij moet je gewoon de td's doorlopen, eventueel mbv parentElement (da's de overlappende TR en dan met een for loop je childs nemen (de TD's))

de TD is geen child van het form element

[stean]

kijk hier heb ik al wat meer aan.

quote:volgens mij moet je gewoon de td's doorlopen

ja dat denk ik ook maar ik weet niet echt hoe.maar heb je een voorbeeldje liggen?

------------------kwam dit tegen is dit het?-------------

code:

The cells property returns an array (collection) of TD element objects nested
inside the current TR object. The length property of this array indicates the number
of actual TD elements in the row, which may not be the number of columns if
one or more cells occupy multiple columns.
Use the cells property in for loops to iterate through all cells within a row.
Assuming your script has a reference to a single row, the loop should look like the
following:

for (var i = 0; i < rowRef.cells.length; i++) {
oneCell = rowRef.cells[i]
// more statements working with the cell
}

[RM-rf]

stean schreef op 23 oktober 2002 @ 16:59:
maar heb je een voorbeeldje liggen?

nope

wat je wilde vragen was hoe je een element dan juist aanspreekt, en daarom gaf ik aan dat je de parentElement-propertie kon gebruiken:

alert(tObj.parentElement.tagName) geeft in jouw functie "TR"
en dat is daar het overlappende element van alle drie de TD's

tip: gewoon wat nalezen over DOM, bv. op http://www.w3schools.com/

dit kan ook handig zijn:
http://www.mozilla.org/do...n-dom-table/#manipulating

[Guillome]

Je kan het veel simpeler doen.

JavaScript:

var prevSel = '';
function _onclick(obj)
{
  if (prevsel != '') document.all[prevsel].style.backgroundColor = '#FFFFFF';
  obj.style.backgroundColor = '#CCCCCC';
  prevsel = obj.id;
}

Kleuren moeje zelf maar doen, maar zo zie je wat ik bedoel

edit
Oh ja, je moet dan wel alle items een unike ID geven.
En zo aanroepen

<td onclick=='_onclick(this);'>

[RM-rf]

aanvulling op Xlerator, wat verkort en hoofdlettergevoeligheid gefixed, deze is tevens zowel msie als moz-compatible, tevens is de ID hier niet nodig (maar geimpliceerd door de UA)

JavaScript:

var prevSel ;
function _onclick(obj)
{
  if (prevSel) prevSel.style.backgroundColor = '#FFFFFF';
  obj.style.backgroundColor = '#CCCCCC';
  prevSel = obj;
}

wel ben ik geinteresseerd in de cells[]-array in de post van de topicstarter, waar heb je die vandaan, is dat een msDHTML-object model-propertie (en dus proprietair, enkel ondersteund door ms, en vaak een versimpleing van standaard DOM-properties en nodelists)?

[stean]

ik heb die code uit de het volgende book (pdf)

javscript bible gold edition [ISBN: 0-7645-4718-6]

en daar staat veel in over object etc. is 35mb groot dus kan moeilijk even mailen. als je geinteresseerd bent kan ik wel kijken of ik hem online kan zetten

[RM-rf]

stean schreef op 23 oktober 2002 @ 17:22:
ik heb die code uit de het volgende book (pdf)

javscript bible gold edition [ISBN: 0-7645-4718-6]

en daar staat veel in over object etc. is 35mb groot dus kan moeilijk even mailen. als je geinteresseerd bent kan ik wel kijken of ik hem online kan zetten

nee hoor, cells is idd een DOM propertie:

interface HTMLTableRowElement : HTMLElement {
readonly attribute long rowIndex;
readonly attribute long sectionRowIndex;
readonly attribute HTMLCollection cells;
attribute DOMString align;
attribute DOMString bgColor;
attribute DOMString ch;
attribute DOMString chOff;
attribute DOMString vAlign;
HTMLElement insertCell(in long index)
raises(DOMException);
void deleteCell(in long index)
raises(DOMException);
};

http://www.w3.org/TR/2000...-one-html.html#ID-6986576

[stean]

ja zie het staan, maar heb het wel degelijk vanuit het boek overgenomen