23. august 2005 - 11:38Der er
45 kommentarer og 1 løsning
radio Show hide 2 felter
jeg har 2 radio buttons hvor jeg gerne vil have at når man vælger den ene så skal der vises en tekst neden under de 2 radiobutons og hvis man vælger den anden skal der stå en anden og det andet tekst skal så "hide"
Vis tekst 1 <input type="radio" name="gnu" onclick="showTxt(1);"> Vis tekst 2 <input type="radio" name="gnu" onclick="showTxt(2);"><br> <span id="txt1" style="display:none;">Dette er tekst 1</span> <span id="txt2" style="display:none;">Dette er tekst 2</span><br>
Jeg har ikke gjort overvejelser i den retning og hvis du siger det så retter jeg gerne ind til højre for at fremme end bedre kodestandard på internettet :)
-- en af mine overvejelser var præcis, hvilken type element, det var mest sandsynligt, thorus kunne bruge ...
-- normalt ville jeg smide tekster, som vises/skjules i block-level-elementer, men i denne situation så det ud til at være fornuftigt med et inline-element !-)
-- men kommentaren gik mere på, at hvis man sætter et element, som normalt er et inline-element til at være block-level, skal man gøre det bevidst !o]
Som du nok har opdaget bliver mit clientside webusvikling stadig gennemført med en grovfil og jeg har blot konstateret at display="block" viser det element jeg forsøger at vise og display="none" skjuler det igen (sørme så!). Jeg er yderst modtagelig overfor opgradering af min fil, så jeg kan gøre flere overvejede valg ifht. hvad jeg skal gøre i de forskellige situationer. Du bringer (endnu) et nyt aspekt ind i mit arbejde med clientside webudvikling - og det er jeg glad for :)
display-propertyen kan tage rigtig mange forskellige værdier, men desværre er en hel del af dem, den del af css1 og -2, som IE ikke understøtter, men disse 3 skulle gælde for alle browsere, der understøtter css:
block|inline|none
-- og forskellen på block-level og inline kan du forestille dig, hvis du f.eks. i et word-dokument markerer 3 ord og trykker på Kursiv-knappen, så vil de tre ord blive hvor de var inde midt i teksten (kursiv er et inline-tag !-), men hvis du opretter en tabel, vil teksten blive delt over, så tabellen bliver et afsnit for sig selv (den er et block-level tag !o]
Vis tekst 1 <input type="radio" name="gnu" onclick="showTxt(this.form,1);"> Vis tekst 2 <input type="radio" name="gnu" onclick="showTxt(this.form,2);"><br>
kan man ikke tage hele: send1 <form onSubmit="return sbasket(this);checkform(this);" name="send" method="post" action="send.phtml" enctype="multipart/form-data">
Vis tekst 1 <input type="radio" name="gnu" onclick="showTxt(this.form,1);"> Vis tekst 2 <input type="radio" name="gnu" onclick="showTxt(this.form,2);"><br>
...
</form>
-- hvis du vil have en retur-værdi fra begge eller alle funktioner skal vi have fat i noget boolean logik !-)
er ikke javascript haj, hvordan får jeg funktionen showtxt til at vise indhold i <form name="sendbasket" method="post" enctype="multipart/form-data"> dynamisk.
jeg har min radio som virker men der kommer ikke indhold på.
if (f.name.value.length < 1) { alert("du har glemt at indtaste dit Navn"); return false; } if (f.postalCode.value.length < 1) { alert("du har glemt at indtaste dit post nr."); return false; }
if (emailCheck(f.email.value) == false) { alert('Du har ikke indtastet en gyldig E-mail'); return false; }
if (f.betingelser.checked == false) { alert("du har glemt at godkende vores betingelser."); return false; }
return true; }
</script> </head>
<body>
<form name="sendbasket" method="post" enctype="multipart/form-data"> <input type="radio" name="gnu" onClick="showTxt(1);">vælg 1<br> <input type="radio" name="gnu" onClick="showTxt(2);">vælg 2 <br><br> <span id="txt1" style="display:none;">Dette er tekst 1 <input type="submit" name="next" value="Betal"></span> <span id="txt2" style="display:none;">Dette er tekst 2 <input type="submit" name="Submit" class="butbasket" value="Gennemfør ordre"></span><br>
Det hele ser ud til at virke. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>radio tjek form</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript"><!-- var newwin = null; function doPopup(f) { newwin = window.open ('', 'Betaling', 'scrollbars,status,width=550,height=600'); newwin.focus(); if (!self.name) self.name = 'shopwin';
if (f.name.value.length < 1) { alert("du har glemt at indtaste dit Navn"); return false; } if (f.postalCode.value.length < 1) { alert("du har glemt at indtaste dit post nr."); return false; }
if (emailCheck(f.email.value) == false) { alert('Du har ikke indtastet en gyldig E-mail'); return false; }
if (f.betingelser.checked == false) { alert("du har glemt at godkende vores betingelser."); return false; }
-- og det skal tilføjes, at det er at lægge op til problemer, hvis man bruger navne, som kan forveksles med element-typer, så find et andet navn til din 'Gennemfør ordre'-knap !-)
Synes godt om
Ny brugerNybegynder
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.
Ny bruger
Nybegynder
Opret
Preview
