Toggle span

1 augusti, 2004

Hej

Har ett script som man kan enabla och disabla ett fält med och nu undrar jag om man kan få det att funka på en span-tagg som är dold så att när man klickar i en kryssryta så visas innehållet i span-taggen.

Så här ser toggle-scriptet ut:

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
var blState=true;
function ToggleState(strElement) {
oObj=document.getElementById(strElement);
oObj.disabled=!oObj.disabled;
}
//-->
</SCRIPT>

Så här ser spantaggen ut:

<span style="DISPLAY: none" id="internet">Innehåll</span>

Och så här ser kryssrutan ut:

<input name="strInternet" type="checkbox" id="strInternet" value="x" onclick="ToggleState('internet');" />

1 augusti, 2004

Hej, kände igen det där, det var jag som skrev det åt dig för ett tag sen va?

Jag har en till lite funktion åt dig nu, med den kan du toggla olika style-attribut med hjälp av ToggleStyle(element,stilNamn,stil1,stil2)

function ToggleStyle(strElement,style,param1,param2) {
oObj=document.getElementById(strElement);
currStyle=eval("oObj.style."+style);
newStyle=(currStyle==param1)?param2:param1;
eval("oObj.style."+style+"='"+newStyle+"'");
}

I ditt fall så ange parametrarna så här:

<input type="checkbox" onclick="ToggleStyleState('internet','display','none','');">

TILLÄGG: Du kan alltså toggla även andra stilar, ex:

ToggleStyleState('internet','backgroundColor','red','black') för att växla bakgrundsfärg.

AnjunaMoon

____________________________________________________________

/* There is nothing more permanent than a temporary solution... */

Stoppa mjukvarupatenten nu! http://www.ffii.se/

[inlägget ändrat 2004-08-01 16:17:37 av Anjuna Moon]

2 augusti, 2004

Du är en ÄNGEL... Tack än en gång för kalasscript... Funkade utmärkt! Poäng till dej min vän.

Ps. Om du behöver bli adopterad någon gång så ställer jag gärna upp

2 augusti, 2004

Hehe, som adoptivbarn blir jag nog lite för dyr i drift (kräver minst 12 år gammal single malt whisky i min nappflaska och runt 14.000 i veckopeng), men tack för erbjudandet =)

Förrestesten, du såg att jag skrev fel namn på funktionsanropet va? (ToggleStyleState istf ToggleStyle. Kunde inte ändra det nu när jag såg det eftersom inlägget var besvarat)

Skriva skräddarsydda script är förresten bara kul, så det är bara att fråga igen när nya roliga problem uppstår

AnjunaMoon

____________________________________________________________

/* There is nothing more permanent than a temporary solution... */

Stoppa mjukvarupatenten nu! http://www.ffii.se/

2 augusti, 2004

Hehe.

Jo jag såg det. Kan säkert klura ut andra roliga saker åt dej ;-)

Har en massa idéer men min js är inte va den borde.

Bra compabilitet föresten... funkar i allt (fast ns4 har jag inte så där vet jag inte hur det ser ut).

2 augusti, 2004

Nä, i gamla browsers som inte stödjer W3C-standarden fungerar inte scripten (NS4, IE4 exempelvis) men använder man dessa bör man nog fundera på att använda en kalkylator istället för en dator

18 december, 2004

För att krångla till allt så skulle jag vilja få den att funka på radio-knappar också, altså om radio-knappen är klickad så visa etc.

Hoppas du (AnjunaMoon) har den här tråden bevakad fortfarande

18 december, 2004

Inte bevakad, men jag råkade komma in precis nu ändå. Här är en variant med radioknappar, som beroende på knapp som är vald, visar olika lager:

[log]

<html>
<head>
<SCRIPT LANGUAGE="JAVASCRIPT" >
<!--
function ToggleStyleState(strElement,style,param1,param2) {
oObj=document.getElementById(strElement);
currStyle=eval("oObj.style."+style);
newStyle=(currStyle==param1)?param2:param1;
eval("oObj.style."+style+"='"+newStyle+"'");
}
//-->
</SCRIPT>
</head>
<body>
<input name="a" checked type="radio" onclick="ToggleStyleState('internet1','display','none','');ToggleStyleState('internet2','display','none','');">
<input name="a" type="radio" onclick="ToggleStyleState('internet2','display','none','');ToggleStyleState('internet1','display','none','');">
<span style="border:1px solid black;" id="internet1">Innehåll 1</span>
<span style="border:1px solid black;display:none" id="internet2">Innehåll 2</span>
</body></html>

[/log]

18 december, 2004

Hehe, enkel lösning. Fast jag hittade en bugg i den. Om man klickar på samma radio två gången så växlar den tillbaka, alltså kan man väldigt lätt få fel text att visas.

18 december, 2004

Ok, ändra följande rader:

<input name="a" checked type="radio" onmousedown="if (!this.checked) {ToggleStyleState('internet1','display','none','');ToggleStyleState('internet2','display','none','');}">
<input name="a" type="radio" onmousedown="if (!this.checked) {ToggleStyleState('internet2','display','none','');ToggleStyleState('internet1','display','none','');}">

18 december, 2004

Weoow... Har jag frågat om jag kan få adoptera dej som min hustomte

Funkar perfekt :thumbsup:

18 december, 2004

Medan jag ändå har dej på *hmm* uppkoplingen. Kan man aplicera den hä på en dropdown? (ojojoj vad jag tjatar ;-) )

18 december, 2004

adoptera dej som min hustomte

Hellre trädgårdstomte isåfall, de blir ju kidnappade och får resa jorden runt gratis

Här kommer en variant för dropdowns:

<html>
<head>
<SCRIPT LANGUAGE="JAVASCRIPT" >
<!--
var oActive;
function ShowLayer(strElement) {
if (oActive) oActive.style.display='none';
oObj=document.getElementById(strElement);
oObj.style.display='';
oActive=oObj;
}

//-->
</SCRIPT>
</head>
<body onload="ShowLayer('internet1');">
<select onchange="ShowLayer(this.options[this.selectedIndex].value);">
<option value="internet1">Visa lager 1
<option value="internet2">Visa lager 2
<option value="internet3">Visa lager 3
</select>
<span style="border:1px solid black;display:none;" id="internet1">Innehåll 1</span>
<span style="border:1px solid black;display:none" id="internet2">Innehåll 2</span>
<span style="border:1px solid black;display:none" id="internet3">Innehåll 3</span>
</body></html>

[inlägget ändrat 2004-12-18 23:45:16 av Anjuna Moon]

13 januari, 2005

Anjuna Moon

Nu är jobbiga jag här igen

Om man vill ha en synlig redan från början då?

Om man bara sätter "display: display" ligger den kvar första gången man byter option (väljer man sen den som var synlig och sen en annan igen så försvinner den men inte första gången).

[bild raderad 1/13/2005 1:08:46 PM av Wepe]

[Kul att man kan radera bild dom inte är uppladdad]

[inlägget ändrat 2005-01-13 13:09:37 av Wepe]

13 januari, 2005

Sätt display utan parameter på den som skall synas från början:

<span style="border:1px solid black;display:" id="internet2">Innehåll 2</span>

13 januari, 2005

Jo syns gör den, problemet är bara att den inte försvinner när man byter i dropdown-menyn och nån av de andra ska försvinna...

13 januari, 2005

Ok, har du en länk till sidan, så kan jag anpassa koden åt dig.

13 januari, 2005

Ok skickar det som mail till dej. Du ska ha stooor tack för att du hjälper till... Fattar inte att du har tid

13 januari, 2005

Kan du ge exempel på vilken som skall synas från början, och vilket val i vilken kontroll som sedan skall gömma den.

13 januari, 2005

Den disablade boxen område ska försvinna när man väljer nåt annat och komma tillbaka när man väljer "Välj ort...".

Om du börjar med att välja tex. Umeå och sen väljer "Välj ort..." igen så funkar allt som det ska därifrån, för då försvinner den disablade dropdownmenyn när man väljer nåt annat. Men inte när man precis har laddat sidan för då förstår den inte att den ska plocka bort den disablade samtidigt som den plockar fram nån av dom andra.

13 januari, 2005

Inte hundra på att jag är med (lång arbetsdag). Varför finns det två Områdes-boxar?

Är det så här det är tänkt:

- Sidan laddas, Kommun/Ort visas. Område är gömt

- Välj Umeå -> En (1) Områdesbox visas

- Välj "Välj ort" -> Områdesboxen göms igen

eller

- Sidan laddas, Kommun/Ort visas. Område är gömt

- Välj Umeå -> Två (2) Områdesboxar visas

- Välj "Välj ort" -> Områdesboxarna göms igen

[inlägget ändrat 2005-01-13 18:25:35 av Anjuna Moon]

13 januari, 2005

- Sidan laddas, Kommun/Ort visas. Område är disablad

- Välj Umeå, Område visas (omrade1)

- Välj Skellefteå, Områda visas (omrade2)

- Välj annan ort, Ort och område visas (ort/omrade3)

- Välj "Välj ort" -> Områdesboxarna disablad igen

[inlägget ändrat 2005-01-13 18:29:53 av Wepe]

13 januari, 2005

Ok, jag tror jag är med nu. Det hela borde (ta i trä) lösas om du ändrar BODY-taggen till:

13 januari, 2005

Som vanligt löser du problemet galant

Oj oj oj, står i stor tacksamhetsskuld till dej o store mästare.

Toggle span

Rekommendera Poster

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Anjuna Moon

Länk till kommentar

Dela på andra webbplatser

Wepe

Länk till kommentar

Dela på andra webbplatser

Arkiverat

Vem är online 0 Medlemmar, 0 anonym, 27 gäster (Visa hela listan)

Populära medlemmar

Publika meddelanden

Senaste som Tittar

Senaste inlägg