Rune Jensen wrote:
> Jeg er i gang med et forsøg med unobtrusive scripting, hvilket jeg ikke
> har prævet før.
>
> Jeg starter i det små, og skal i første omgang have lavet et lille
> test-script, som simulerer:
>
> <p>Denne tekst er <span onclick="javascript:alert('du trykkede på
> teksten')">klikbar</span></p>
>
> Sådan at det i stedet ser ud som dette:
>
> <p>Denne tekst er <span>klikbar</span></p>
>
> men stadig virker med onClick. Alerten er ikke så vigtig, men det skal
> helst være et eller andet, så man kan se, der sker noget, at det virker.
>
> ...Altså hvordan putter man sådan en eventhandler på udenfor HTMLen?
> Jeg kan godt se, der vel må være en ID af en art?
> Iøvrigt, så skal det hele vel startes med body onload, ikk?
>
> Hvis nogen kan give svaret og/eller har et lignende lige så simpelt
> eksempel liggende som ovenstående ville det være fantastik.
Jeg har for nylig fedtet med noget javascript, som indeholder de ting du
spørger om + lidt mere.
Jeg har valgt at citere det hele i stedet for at bytte om på teksten.
For at tage det fra en ende af, så ja, scriptet skal startes med en body
onload. For at lave disse ting, skal DOM'en være bygget, hvilket den først
er færdig med, når al HTML'et er parset.
Men til eksemplet her:
<
http://w-o-p-r.dk/notes/viewexample.html>
tilhørende javascript:
<
http://w-o-p-r.dk/javascript/notes.view.js>
så er den startende funktion denne her i onload : initiate_table('mainview')
her overfører jeg 'mainview' som id til funktionen, men man kan ligeså godt
hardcode id'en i selve scriptet, hvis man vil det.
Så - jo, din <span> skal have en id for at finde den.
Selve noden finder du med document.getelementbyid.
Hvis vi kalder din variabel for newtd, altså
var newtd = document.getElementById(<din_id>) ;
så burde de samme linier kunne genbruges:
.....
if ( newtd.addEventListener ) {
newtd.addEventListener ('mousedown',toggle_rows,false) ;
} else {
newtd.onmousedown = toggle_rows ;
}
.....
her har jeg brugt mousedown, men man kan også bruge mouseup - begge events
'fyres' når man klikker med musen.
toggle_rows er den funktion, der skal kaldes ved 'OnClick'.
Af hensyn til brugerne, skal man huske at vise, at den er klikbar med:
newtd.style.cursor = 'pointer' ;
Der var vist et eller andet engang med nogle browsere brugte 'hand', men det
er uden for min viden.
Funktionen toggle_rows kan du se i .js filen, og hvis du skal bruge target i
dit javascript, er der (som sædvanlig) noget IE specifik kode.
Hvis du blot skal lave en alert, behøver du kun den ene linie.
Men ellers Rune - det er god karma at lægge et eksempel på nettet, og angive
et link ;)
--
Med venlig hilsen
Stig Johansen