functie-aanroep?

[Johannes2008]

Dag,

Ik heb binnen de javascriptsectie een deel staan:

...
function wijzigRand(){
document.getElementById("div2").style.border = rand;
}
function pasBreedteAan(waarde){
document.getElementById("div2").style.width = waarde;
}
...

en verderop in de body:

...
<li>
Border <strong>div2</strong> =
<input name="rand" type="text" id="rand" value="5px dotted #666666" onblur="javascript:wijzigRand();" />
<label> </label> (onBlur)
</li>
<li>
Maak <strong>div2</strong>
<a href="javascriptasBreedteAan('600px');">600px</a> -
<a href="javascriptasBreedteAan('500px');">500px</a> -
<a href="javascriptasBreedteAan('90%');">90%</a> breed
</li>
...

De div2-tag is elders gedefinieerd. De functies passen de rand en de breedte van deze div aan. De functie pasBreedteAan werkt prima. De functie wijzigRand niet. Als ik binnen die functiedefinitie in plaats van rand bijv neerzet '10px solid #FF0000' werkt het weer wel.
Wat doe ik fout?

Johannes

 

[NielsDesmet]

Je bent de declaratie van je argument 'rand' vergeten! Je moet gewoon 'wijzigRand()' vervangen door 'wijzigRand(rand)'!

 

[VVouter]

In de onblur hoeft geen javascript te staan, dus

onblur="wijzigRand();"

 

[Johannes2008]

Dank voor jullie reacties, maar het geeft nog geen oplossing. Het programma is een opdracht uit een boek, de HTML-code was er al, alleen het javascript moet geschreven worden, verder is er een voorbeeld waarin je kunt zien hoe het moet worden. In die code staat het deel met de "onblur" al, en de functieaanroep wijzigRand zonder argument! Er moet dus een globale variable overgedragen worden lijkt me. Maar ik dacht dat die dan 'rand' zou moeten heten (zo zou het in vb Pascal gaan). Maar hier dus niet. En het is me ook niet duidelijk of die dan tussen quotes zou moeten staan.
Hebben jullie nog een ander idee?

 

[NielsDesmet]

Maar als ik het goed begrip stelt hij de border-stijl gelijk aan de value die in je 'Rand' tekst veldje staat?

Probeer dan es dit (als wijzigRand functie):

function wijzigRand(){
document.getElementById("div2").style.border = document.getElementById("rand").value;
}

Dat zou moeten werken.

 

[Johannes2008]

Niels,

Helemaal goed. Het ging er inderdaad om hoe in de code de waarde van het invoerveld (rand) te benaderen. Zo dus.

Dank, Johannes

 

[Egel]

Het kan ook met één functie:

<script>
 // Egel 080807 ;)
 function adjustStyle(e,s,v) {
  document.getElementById(e).style[s] = v;
  };
</script>


<li>
 Border <b>div1</b> =
 <input type="text" value="3px dotted #0c0" onblur="adjustStyle('div1','border',this.value);" />
 (onBlur)
</li>
<li>
 Maak <b>div1</b>
 <a href="javascript:adjustStyle('div1','width','600px');">600px</a> -
 <a href="javascript:adjustStyle('div1','width','500px');">500px</a> -
 <a href="javascript:adjustStyle('div1','width','90%');">90%</a> breed
</li>

<div id="div1" style="border: 1px solid #000;">div1<br>****<br>****</div>


<br><br>
<li>
 Border <b>div2</b> =
 <input type="text" value="3px dotted #f00" onblur="adjustStyle('div2','border',this.value);" />
 (onBlur)
</li>
<li>
 Maak <b>div2</b>
 <a href="javascript:adjustStyle('div2','width','600px');">600px</a> -
 <a href="javascript:adjustStyle('div2','width','500px');">500px</a> -
 <a href="javascript:adjustStyle('div2','width','90%');">90%</a> breed
</li>

<div id="div2" style="border: 1px solid #000;">div2<br>****<br>****</div>

Vr.Gr. Egel.

 

[Johannes2008]

Egel,

Ja dat is ook mooi, weer wat geleerd