[JS & HTML] table cell id achterhalen

[Verwijderd]

Ik wil een link maken waarvan de inhoud verandert als je er op klikt. Nou heb ik een hele tabel van dergelijke links, en aan elke link hang ik een onclick event die een javascript functie aanroept. Mijn probleem is nu dat de functie die aangeroepen wordt om de inhoud van de link te veranderen niet weet op welke cell in de tabel geklikt is om zodoende de inhoud van de juiste te wijzigen. Hoe kan ik de id (welke row, welke col) van de cell achter achterhalen waarop geklikt is?

Alvast bedankt voor de hulp!

[Bram77]

Handmatig meegeven aan de functie is geen optie?

Lukt het niet met 'this'?
onClick="jeFunctie(this)"

function jeFunctie(obj){
obj.innerHTML = string[x];
}

[ Voor 120% gewijzigd door Bram77 op 08-07-2005 23:12 ]

[André]

Een onclick geeft altijd een event mee die je kunt gebruiken om te achterhalen waar er geklikt is.

code:

funtion klik(evt)
{
  if (!evt) { evt = event; }

  elm = evt.target ? evt.target : evt.srcElement;

  alert(elm) // Dit is je cel ;)
}

[Bram77]

.....niet goed gelezen

[ Voor 90% gewijzigd door Bram77 op 08-07-2005 23:20 ]

[Verwijderd]

André schreef op vrijdag 08 juli 2005 @ 23:11:
Een onclick geeft altijd een event mee die je kunt gebruiken om te achterhalen waar er geklikt is.

code:

funtion klik(evt)
{
  if (!evt) { evt = event; }

  elm = evt.target ? evt.target : evt.srcElement;

  alert(elm) // Dit is je cel ;)
}

Ik begrijp eerlijk gezegd niet precies wat de functie klik doet, maar als ik het hang aan een onclick event (zoals hieronder), dan print hij altijd 'javascript:void(0)' uit. Maar wat ik wil weten zijn de x, y coordinaten in de tabel, met x als rij positie en y als colom positie.

code:

<a href="javascript:void(0)" onclick="klik()">LINK</a>

[ Voor 13% gewijzigd door Verwijderd op 09-07-2005 13:01 ]

[André]

Jij wil de inhoud van de link veranderen? Dat zou je dan zo kunnen doen:

code:

funtion klik(evt)
{
  if (!evt) { evt = event; }

  elm = evt.target ? evt.target : evt.srcElement;

  elm.innerHTML = "BLA";
}

<a href="javascript:void(0)" onclick="klik()">LINK</a>

of zo:

code:

funtion klik(elm)
{
  elm.innerHTML = "BLA";
}

<a href="javascript:void(0)" onclick="klik(this)">LINK</a>

/edit:
Je zou alle cellen een id kunnen geven waarin hun x en y coordinaten staan, dan kun je aan de hand daarvan kijken waar geklikt is.

Maar wat wil je nu precies dan, eerst zeg je dat je de inhoud van de link wil veranderen en nu zeg je dat je alleen wilt weten wat de x en y coordinaten van de cel zijn. Als je de 2de manier gebruikt die ik je gaf hoef je de coordinaten helemaal niet te weten en kun je heel simpel de cel aanpassen.

[ Voor 37% gewijzigd door André op 09-07-2005 13:06 ]

[Bram77]

Of je captured onclick de muiscoordinaten.
Maar het is me niet presies duidelijk wat je wilt bereiken. Post de source! Dan kunnen we je een stuk beter van dienst zijn

[Verwijderd]

André schreef op zaterdag 09 juli 2005 @ 13:02:
Jij wil de inhoud van de link veranderen? Dat zou je dan zo kunnen doen:

code:

funtion klik(evt)
{
  if (!evt) { evt = event; }

  elm = evt.target ? evt.target : evt.srcElement;

  elm.innerHTML = "BLA";
}

<a href="javascript:void(0)" onclick="klik()">LINK</a>

of zo:
[code]
funtion klik(elm)
{
elm.innerHTML = "BLA";
}


Maar wat wil je nu precies dan, eerst zeg je dat je de inhoud van de link wil veranderen en nu zeg je dat je alleen wilt weten wat de x en y coordinaten van de cel zijn. Als je de 2de manier gebruikt die ik je gaf hoef je de coordinaten helemaal niet te weten en kun je heel simpel de cel aanpassen.

ik wil de inhoud veranderen, maar ik ging ervan uit dat ik de x,y coordinaten nodig heb om een specifieke cel inhoud te kunnen veranderen, maar uit jou bewoording begrijp dat dat niet nodig is.

Overigens, IE geeft bij de tweede manier een foutmelding. Hij zegt dat er een onbekende rutime error heeft plaatsgevonden bij "elem.inner...."

en dit is mijn source:

code:

var conditional = 0;

function change_conditional(elm) {
   if (conditional == 0) {
      elm.innerHTML ="<p><b> <ahref=\"javascript:void(0)\"onclick=\"change_conditional()\">IF&nbsp;NOT</b></p>";
      conditional = 1;
   }
   if (conditional == 1) {
      elm.innerHTML = "<p><b><a href=\"javascript:void(0)\" onclick=\"change_conditional()\">IF</b></p>";
      conditional = 0;
   }
}



<table id="mytable" border="1" style="cusor: hand">
   <caption><center><h3>mytable</h3></center></caption>
   <tr>
      <td width="60" align="left">
         <p><b><a href="javascript:void(0)" onclick="change_conditional(this)">IF</b></p>
      </td>
   </tr>
</table>

[ Voor 65% gewijzigd door Verwijderd op 09-07-2005 13:28 ]

[Bram77]

Probeer het dan eens met 'this'. Kan niet echt misgaan.
Maar wil je de de link (dus de text waar op geklikt wordt) of de src='' inhoud veranderen?

de twee opties...

src veranderen

code:

function jeFunctie(obj){
 obj.src='andereSRC.html';
}

inhoud veranderen...

code:

function jeFunctie(obj){
 obj.innerHTML='Andere inhoud';
}

aanroepen met <A href="javascript:void(0);" onClick="jeFunctie(this)">KLIK</A>

[André]

Die runtime error komt door je rare escaping:

code:

elm.innerHTML = '<p><b><a href="javascript:void(0);" onclick="change_conditional()">IF NOT</b></p>';

[Verwijderd]

André schreef op zaterdag 09 juli 2005 @ 13:26:
Die runtime error komt door je rare escaping:

code:

elm.innerHTML = '<p><b><a href="javascript:void(0);" onclick="change_conditional()">IF&nbsp;NOT</b></p>';

nee dat is het niet.

[Verwijderd]

Bram77 schreef op zaterdag 09 juli 2005 @ 13:23:

inhoud veranderen...

code:

function jeFunctie(obj){
 obj.innerHTML='Andere inhoud';
}

aanroepen met <A href="javascript:void(0);" onClick="jeFunctie(this)">KLIK</A>

ik wil dus de inhoud veranderen, maar die methode wil dus op een of andere manier niet werken

[ Voor 18% gewijzigd door Verwijderd op 09-07-2005 13:32 ]

[Verwijderd]

Waarom gaan we niet gewoon met this aan de gang? Je moet wel gek zijn om het event object te willen gebruiken als dat nergens voor nodig is. Met de DOM methods/properties moet je dit wel kunnen klaren.

[Verwijderd]

Verwijderd schreef op zaterdag 09 juli 2005 @ 13:34:
Waarom gaan we niet gewoon met this aan de gang? Je moet wel gek zijn om het event object te willen gebruiken als dat nergens voor nodig is. Met de DOM methods/properties moet je dit wel kunnen klaren.

bedoel je iets in de trant van:

code:

var elm = this.cells;
elm[0].innerHTML = "blablabla";

zoiets als dit voorbeeld:
http://www.w3schools.com/...me=try_dom_tablerow_cells

[ Voor 12% gewijzigd door Verwijderd op 09-07-2005 13:38 ]

[André]

Zo bedoel ik dus:

code:

var conditional = 0;

function change_conditional(elm) {
   
   if (conditional == 0) {
      elm.innerHTML = "IF NOT";
      conditional = 1;
   } else {
      elm.innerHTML = "IF";
      conditional = 0;
   }
}

<a href="#" onclick="change_conditional(this)">IF</a>

En let er op dat je 2 keer een if achter elkaar had, dat gaat nooit werken want je zet conditional op 1 en direct voert hij de 2de if ook uit

[Verwijderd]

André schreef op zaterdag 09 juli 2005 @ 13:46:
Zo bedoel ik dus:

code:

var conditional = 0;

function change_conditional(elm) {
   
   if (conditional == 0) {
      elm.innerHTML = "IF NOT";
      conditional = 1;
   } else {
      elm.innerHTML = "IF";
      conditional = 0;
   }
}

<a href="#" onclick="change_conditional(this)">IF</a>

En let er op dat je 2 keer een if achter elkaar had, dat gaat nooit werken want je zet conditional op 1 en direct voert hij de 2de if ook uit

/edit

[ Voor 13% gewijzigd door Verwijderd op 09-07-2005 14:39 ]

[André]

Test het nou eerst eens

[Verwijderd]

André schreef op zaterdag 09 juli 2005 @ 14:39:
Test het nou eerst eens

sorry, te snel conclusies getrokken.
hartelijk dan man!

[André]