Avatar billede mik789 Nybegynder
09. april 2002 - 10:02 Der er 23 kommentarer og
2 løsninger

hjælp til forenkling af script

Jeg skal lave et dokument hvor enkelte sætninger er markeret som henvisninger til noter. Når man holder musen over sætningen, skal noten stå i en iframe. Jeg har lavet scriptet på rigtig begyndervis (se nedenfor), men når jeg når op på 20-50 noter bliver det her selvfølgeligt for besværligt. Hvordan forenkler jeg det her bedst? Helst sådan at noter kan tilføjes og slettes løbende uden at man skal tilføje/slette andet end note-variablen (noteX = 'Det her er noteX'). Dvs. noget med nogle arrays der holder styr på hvor vi er eller så'n ?-) [betyder: ser spørgende, lidt dum ud]. Her er det der gerne skulle forenkles:

<html>
<head>

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var note1 = 'Det her er note 1';
var note2 = 'Det her er note 2';
var note3 = 'Det her er note 3';

function skrivNote1() {
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + note1 + endHTML);
  parent.iframe.document.close();
}

function skrivNote2() {
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + note2 + endHTML);
  parent.iframe.document.close();
}

function skrivNote3() {
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + note3 + endHTML);
  parent.iframe.document.close();
}

</script>

</head>

<body>

<iframe src="iframe.html" name="iframe" width="25%" height="80%" border="1" align="left" scrolling="auto"></iframe>

<p><a href="" onMouseOver="skrivNote1();" onClick="return false;">Dette skal forklares med note1</a></p>
<p><a href="" onMouseOver="skrivNote2();" onClick="return false;">Dette skal forklares med note2</a></p>
<p><a href="" onMouseOver="skrivNote3();" onClick="return false;">Dette skal forklares med note3</a></p>

</body>
</html>
Avatar billede boris Mester
09. april 2002 - 10:08 #1
<html>
<head>

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var note1 = 'Det her er note 1';
var note2 = 'Det her er note 2';
var note3 = 'Det her er note 3';

function skrivNote(tekst)
{
parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + tekst + endHTML);
  parent.iframe.document.close();
  }
</script>

</head>

<body>

<iframe src="iframe.html" name="iframe" width="25%" height="80%" border="1" align="left" scrolling="auto"></iframe>

<p><a href="" onMouseOver="skrivNote(note1);" onClick="return false;">Dette skal forklares med note1</a></p>
<p><a href="" onMouseOver="skrivNote(note2);" onClick="return false;">Dette skal forklares med note2</a></p>
<p><a href="" onMouseOver="skrivNote(note3);" onClick="return false;">Dette skal forklares med note3</a></p>

</body>
</html>
Avatar billede emileej Nybegynder
09. april 2002 - 10:09 #2
For eksempel således:

<html>
<head>

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var noter=new Array('Det her er note 1','Det her er note 2','Det her er note 3');

function skrivNote(num) {
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + noter[num-1] + endHTML);
  parent.iframe.document.close();
}
</script>

</head>

<body>

<iframe src="iframe.html" name="iframe" width="25%" height="80%" border="1" align="left" scrolling="auto"></iframe>

<p><a href="" onMouseOver="skrivNote(1);" onClick="return false;">Dette skal forklares med note1</a></p>
<p><a href="" onMouseOver="skrivNote(2);" onClick="return false;">Dette skal forklares med note2</a></p>
<p><a href="" onMouseOver="skrivNote(3);" onClick="return false;">Dette skal forklares med note3</a></p>

</body>
</html>


E-)mil
http://mfp.eej.dk
Avatar billede emileej Nybegynder
09. april 2002 - 10:10 #3
dammn - jeg kom ikke først! sys nu alligevel bedre om min end boris' :)~

E-)mil
Avatar billede nikolajdu Nybegynder
09. april 2002 - 10:12 #4
Jeg er også langsom med min array version, anyway så er den her.

<html>
<head>

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var note = ['Det her er note 1','Det her er note 2','Det her er note 3']

function skrivNote(tekst)
{
parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + note[tekst-1] + endHTML);
  parent.iframe.document.close();
  }
</script>

</head>

<body>

<iframe src="iframe.html" name="iframe" width="25%" height="80%" border="1" align="left" scrolling="auto"></iframe>

<p><a href="" onMouseOver="skrivNote(1);" onClick="return false;">Dette skal forklares med note1</a></p>
<p><a href="" onMouseOver="skrivNote(2);" onClick="return false;">Dette skal forklares med note2</a></p>
<p><a href="" onMouseOver="skrivNote(3);" onClick="return false;">Dette skal forklares med note3</a></p>

</body>
</html>
Avatar billede boris Mester
09. april 2002 - 10:15 #5
I det her tilfælde kan det næsten være ligemeget med array; smag og behag.
Fordelen ved array er, at du kan skrive alle bemærkningerne i en lang tekststreng, men du kommer også lettere ti at lave syntaks-fejl.
Hvis man ikke bruger array, gælder det bare om at lave korte og nemme navne på tekststumperne, f.eks. t1,t2,t3....
Avatar billede boris Mester
09. april 2002 - 10:23 #6
Den kan selvfølgelig også forenkles en smule mere; stadig uden array


var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var note1 = 'Det her er note 1';
var note2 = 'Det her er note 2';
var note3 = 'Det her er note 3';

function s(tekst)
{

parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + "note"+tekst + endHTML);
  parent.iframe.document.close();
  }
</script>

</head>

<body>

<iframe src="iframe.html" name="iframe" width="25%" height="80%" border="1" align="left" scrolling="auto"></iframe>

<p><a href="" onMouseOver="s(1);" onClick="return false;">Dette skal forklares med note1</a></p>
<p><a href="" onMouseOver="s(2);" onClick="return false;">Dette skal forklares med note2</a></p>
<p><a href="" onMouseOver="s(3);" onClick="return false;">Dette skal forklares med note3</a></p>

</body>
</html>
Avatar billede nikolajdu Nybegynder
09. april 2002 - 10:26 #7
Syntax fejlen laver man inden man smider siden ud og når mn så smider den ud, så vil den fylder mindre io array versionen og det er jo altid godt. Specielt som siden vokser med 50-100 indlæg :))

/Nikolaj
Avatar billede jakoba Nybegynder
09. april 2002 - 10:27 #8
Og den allersidste, allersløvete version af det samme:

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var noter = new Array(
          'Det her er note 0',  // arrays starter i 0
          'Det her er note 1',
          'Det her er note 2',  // såmange noter du vil med komma imellem
          'Det her er note 3'  // men ikke komma efter allersidste
                      };

function skrivNote( nummer ) {
    // blot en enket funktion der får notens indexnummer i arrayet med som parameter
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + noter[nummer] + endHTML);
  parent.iframe.document.close();
}

</script>

mvh JakobA
Avatar billede jakoba Nybegynder
09. april 2002 - 10:29 #9
Ug endda med gratis fejl i :(  Arrayet skal afsluttes med  );  ikke med  };
Avatar billede boris Mester
09. april 2002 - 10:31 #10
OG SÅ SYNES JEG, DER BØR VÆRE EKSTRA-POINTS til den, der får det til virke i NS6.1 eller Opera 5.12!
Avatar billede nikolajdu Nybegynder
09. april 2002 - 10:32 #11
Jakoba ved du hvd forskellen er på disse to??

['Det her er note 1','Det her er note 2','Det her er note 3'] //Nikolaj
('Det her er note 1','Det her er note 2','Det her er note 3'); // Emil
Avatar billede mik789 Nybegynder
09. april 2002 - 10:34 #12
hmmmn, hjælp mig lige med forståelsen: så vidt jeg kan se er boris' det enkleste, og man kan netop tilføje og slette note-variablerne som det falder for uden videre. Hvis jeg så tillige ændrer navnene på notevariablerne så de er uden nummer, men f.eks. bare det ord der skal forklares, f.eks.:

var kineser = 'Person født i Kina'

- så skal man bare fjene/tilføje to steder: blandt notevariablerne og i body hvor ordet "kineser" (som pseudolink) forekommer. Hvorimod med array løsningen kommer man ikke uden om numre der skal opdateres hver gang man foretager en ændring - eller hyr?
Avatar billede boris Mester
09. april 2002 - 10:39 #13
Hvis du IKKE bruger Array, vil der ikke så let opstå forvekslinger. Der sker ikke noget ved, at du har tekststrenge liggende, du ikke bruger. det er også let at overskue med mange tekstrklæringer skrevet over hinanden:
var t1 = "tekst1"
var t2 = "tekst2"
.....
Hvis du bruger Array, skal rækkefølgen nøje overholdes.
Men det er rigtigt, at Arrayet i en lang tekststreng (på een linie) tager mindre plads. Det er væsentligt, hvis du skal gentage det mange hundrede gange.
Avatar billede boris Mester
09. april 2002 - 10:43 #14
Det er helt oplagt at bruge rigtige navne for variablerne. Det fylder en smule mere, men er langt mere sikkert.
Hvis du vil spare på pladsen (som nikolajdu anbefaler) kan du skrive sådan:
var note1 = 'Det her er note 1';var note2 = 'Det her er note 2';var note3 = 'Det her er note 3';
(Det skal være på een linie)
Avatar billede mik789 Nybegynder
09. april 2002 - 10:44 #15
jeg tror jeg vil bruge boris' løsning så længe jeg ikke oplever nogle problemer i forb.m. størrelsen. og så eksperimentere med array-forslagene også. tak drenge!
Avatar billede jakoba Nybegynder
09. april 2002 - 10:46 #16
jo det kan du sagtens komme udenom, med et 'associativt array:

{name:"Gabby", breed:"Lab", color:"chocolate", sex:"girl"}

<script language="javascript">

var startHTML = '<body bgcolor="#dedede"><p class="tekst">';
var endHTML = '</p></body>';
var noter = {
          'kineser:'Det her er note 0',  // arrays starter i 0
          "japaner":'Det her er note 1',
          "ost":'Det her er note 2',  // såmange noter du vil med komma imellem
          "fejeblad":'Det her er note 3'  // men ikke komma efter allersidste
                      };  // nu er det virkelig sluttuborg der skal bruges.

function skrivNote( ord ) {
    // blot en enket funktion der får notens indexnummer i arrayet med som parameter
  parent.iframe.document.open("text/html");
  parent.iframe.document.write(startHTML + noter[ord] + endHTML);
  parent.iframe.document.close();
}

</script>

Nu er det ligemeget hvad rækkefølge noterne står i og du kan slette/tilføje som du vil, for nu bruger du den streng der står foran : til at slå op med.

<p><a href="" onMouseOver="skrivNote('japaner');" onClick="return false;">Dette skal forklares med note1</a></p>

men det er en smagssag om det så er 'bedre' end boris's løsning med enkelte variabler.

mvh JakobA
Avatar billede mik789 Nybegynder
09. april 2002 - 10:54 #17
jakoba> OK! nu har jeg virkelig noget at vælge imellem. jeg må prøve dem hver for sig.
Avatar billede mik789 Nybegynder
09. april 2002 - 10:58 #18
jakoba> og hvad var egentlig svaret på nikolajdus sp. 09/04-2002 10:32:09?
Avatar billede jakoba Nybegynder
09. april 2002 - 11:51 #19
jer er usikker på forskellen.

nikilajdu's ville jeg mene er syntaktisk ukorrekt javascript. [ ] er til indexering i arrays og der findes ikke fler-dimensionelle arrays i javascript.

emileej's er parametre til en funktion, uden noget der peger på en javascript funktion foran ville jeg tro den er ukorrekt.

Men der er meget jeg ikke ved, især med hensyn til hvad IE accepterer som 'alternativ syntaks' i forskellige situationer.

mvh JakobA
Avatar billede boris Mester
09. april 2002 - 11:55 #20
Og når vi nu taler om IE - hvem kan få dette her til at virke i NS og Opera???
Avatar billede mik789 Nybegynder
09. april 2002 - 14:12 #21
det her - både mit oprindelige script og din forenkling af det - virker fint i NS v. 6.2.1 som er den jeg har. Opera har jeg ikke prøvet.
Avatar billede boris Mester
09. april 2002 - 14:19 #22
Fint at høre. Så er NS blevet bedre siden 6.1.
Nu er det jo heller ikke mere end ganske få "almindelige" mennesker, der ikke bruger IE.
Avatar billede emileej Nybegynder
09. april 2002 - 22:18 #23
Høps! Nu missede jeg alt det sjove!
>>mik789
Hvad besluttede du dig for at bruge?

E-)mil
http://mfp.eej.dk
Avatar billede mik789 Nybegynder
10. april 2002 - 06:40 #24
emileej> jeg pusler lidt med alle løsningerne først for at se hvad der fungerer bedst til formålet - også for at forstå hvordan de hver især virker ;-)

/mik
Avatar billede emileej Nybegynder
10. april 2002 - 07:56 #25
Hehe - fino fino :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester