Dieser Beitrag ist schon älter. Bitte vergewissern Sie sich, dass die Rahmenbedingungen oder der enthaltene Lösungsvorschlag noch dem aktuellen Stand der Technik entspricht.

HTML teile verstecken

Mitglied: leb0rtran
hallo,

der Titel si jetzt nich de rbeste aber mir fällt nix besseres ein ...

Mich würde interessieren ob es geht, dass man für jede option die ich per
auswählen kann die restliche Seite leicht geändert angezeigt wird

für books zB:

für filme dann:

und ein paar einträge sollen kommlett "versteckt" werden zB

Hoffe mir kann jemand weiterhelfen
Schonmal thx

leb0rtran

Content-Key: 66660

Url: https://administrator.de/contentid/66660

Ausgedruckt am: 17.09.2021 um 17:09 Uhr

Mitglied: filippg
filippg 21.08.2007 um 01:27:52 Uhr
Goto Top
Hallo,

soweit ich das erstmal erkenne sind das zwei verschiedene Sachen:

1. "und ein paar einträge sollen kommlett "versteckt" werden zB" daraus schließe ich, dass sie nie angezeigt werden, auch nicht in Abhängigkeit von den obigen Radio-Buttons? Dann solltest du einfach <input type="hidden"...> verwenden.

2. die anderen Abschnitte sollen wohl nur angezeigt werden, wenn oben die entsprechende Option (type) gewählt ist? Das lässt sich mit JavaScript ganz gut machen. Und eigentlich sollten das alle Ajax-Bibliotheken können. Die Abschnitte werden in <div>s verpackt und können dynamisch (also während der Anzeige im Browser, in Abhängigkeit von Ereignissen wie dem Auswählen eines anderen Radio-Buttons, angezeigt und ausgeblendet werden. Suche naja "Ajax" oder "HTML layer ausblenden javascript" o.ä.

Filipp
Mitglied: leb0rtran
leb0rtran 21.08.2007 um 02:11:42 Uhr
Goto Top
zu 1.
ne nicht komplett sondern nur wenn file gedrückt is wirds garnicht angezeigt sondern nur bei books

zu 2.
kk ich probiers ma xD
Mitglied: leb0rtran
leb0rtran 21.08.2007 um 02:23:13 Uhr
Goto Top
ich find leider nix gescheites wie ich das funktioniert
hab von javascript auch leider 0plan

kannste mir des ma genauer erklähren wie das gehn soll
Mitglied: aliasmp3
aliasmp3 21.08.2007 um 10:58:49 Uhr
Goto Top
hi leb0rtran

hab hier was kleines für dich was dein problem lösen sollte. ich hoffe das forum lässt den code zu. er is mit firefox und ubuntu getestet und funktioniert dort. einfach die checkbox anklicken

<script type="text/javascript">
function hide(){
if(document.getElementById("test").checked==true){
document.getElementById("text").type="hidden";
}
}
</script>

<form action="" method="post">
<input type="checkbox" name="test" id="test" onclick="hide();" />
<input type="text" name="text" id="text" />
</form>
Mitglied: leb0rtran
leb0rtran 21.08.2007 um 15:02:05 Uhr
Goto Top
mh, funktioniert ma nich

was is da falsch?


Mitglied: aliasmp3
aliasmp3 21.08.2007 um 20:00:35 Uhr
Goto Top
im folgenden dein script wie du es wahrscheinlich wolltest.

erklärung:ne funktion kann es nur einmal geben (ausser in spezialfällen) und diese fälle sind hier nicht gegeben, daher hide1,2,3.

ausserdem ist es ein unterschied ob du in ein input feld schreibst oder in ein html element wie z.b. div,span,...

in inputfelder oder formularelemente schreibst du mit value
in html elemente mit innerHTML

<body>

<script type="text/javascript">
function hide1(){
if(document.getElementById("book1").checked==true){
document.getElementById("film").innerHTML="";
document.getElementById("sonstiges").innerHTML="";
}
}

function hide2(){
if(document.getElementById("film1").checked==true){
document.getElementById("book").innerHTML="";
document.getElementById("sonstiges").innerHTML="";
}
}

function hide3(){
if(document.getElementById("sonstiges1").checked==true){
document.getElementById("book").innerHTML="";
document.getElementById("film").innerHTML="";
}
}
</script>



<form action="ebay-script.php" method="post">

<p>

<table border="0" cellspacing="20" cellpadding="0">

<tr>
<td>
Artikeltyp:<br>
<input type="radio" name="type" value="book" checked="checked" id="book1" onclick="hide1();"> Buch <br>
<input type="radio" name="type" value="film" id="film1" onclick="hide2();"> Film <br>
<input type="radio" name="type" value="sonstiges" id="sonstiges1" onclick="hide3();"> Sonstiges <br>
</td>
</tr>

</table>


<div id="book">
<table border="0" cellspacing="20" cellpadding="0">

blub BOOK

</table>
</div>


<div id="film">
<table border="0" cellspacing="20" cellpadding="0">

blub FILM

</table>
</div>


<div id="sonstiges">
<table border="0" cellspacing="20" cellpadding="0">

blub SONSTIGES

</table>
</div>
</p>
</form>
</body>
Mitglied: leb0rtran
leb0rtran 21.08.2007 um 23:25:59 Uhr
Goto Top
ok ...
2 probleme gibts da noch

1. standartmäßig is ja books markiert, es zeigt aber alle 3 div-boxen an, nicht nur books

2. wenn ich erst auf filme geh und dann zurück auf books zeigts nüx mehr an
da wärs nice wenns wieder books anzeigt
Mitglied: aliasmp3
aliasmp3 22.08.2007 um 07:47:52 Uhr
Goto Top
zu1

es gibt das onload event heißt wenn du eine funktion beim laden ausführen möchtest kannst du das in den body packen

<body onload="hide1();">
.....
</body>
damit führt er hide1 beim laden der seite aus


zu 2

dafür musst du nur die funktionen anpassen. das document.getElementById("").innerHTML=""; muss angepasst werden. im moment löschst du nur inhalte bzw du schreibst einen leerstring rein mit "". um einfach was reinzuschreiben musst du nur zwischen die "" einen text schreiben.
Mitglied: leb0rtran
leb0rtran 22.08.2007 um 13:53:12 Uhr
Goto Top
1. funktioniert jetzt

2. aber ich möcht ja nich was reinschreiben sondern er soll wieder die entsprechende div box anzeigen, also bei funktion1 die div box book etc
wie geht das?
Mitglied: aliasmp3
aliasmp3 22.08.2007 um 14:20:58 Uhr
Goto Top
wenn du die funktion hide1 aufrufst geht diese einfach her und löscht den inhalt einer der div boxen. damit das was vorher drin stand wieder drin steht musst du einfach anstatt der "" einen text "..." schreiben. dann steht dieser text in der entsprechenden div box.

bsp:

function hide1(){
if(document.getElementById("book1").checked==true){
document.getElementById("film").innerHTML="";
document.getElementById("sonstiges").innerHTML="";
//die nächste zeile ist die antwort
document.getElementById("book").innerHTML="blub BOOK";
}
}
Mitglied: leb0rtran
leb0rtran 23.08.2007 um 22:59:30 Uhr
Goto Top
ja, aber kann ich da nich irgentwie nen verweiß auf den inhalt der div box machen?
sonst müsst ich ja den kompletten inhalt der box nochma in die funktion reinschreiben (is n bisschen mehr als nur "blub BOOK" xD)
Mitglied: aliasmp3
aliasmp3 24.08.2007 um 09:05:03 Uhr
Goto Top
var film='test';

function hide1(){
if(document.getElementById("book1").checked==true){
document.getElementById("film").innerHTML=film;
document.getElementById("sonstiges").innerHTML="";
}
}

du kannst es wie die var film erzeugen und dann innerhalb der funktionen verwenden. du musst nur aufpassen das du keine zeilenumbrüch drin hast, heißt zeilenumbrüch im quelltext. sowas wie ein <br /> darf natürlich drin stehen. wenn du nun noch inputfelder oder sonstige stellen mit ' verwenden willst musst du sie im quelltext duch \' kennzeichnen. der \ sagt jvascript das jetzt ein zeichen kommt das nicht interperitiert werden soll. du kannst auch im oberen bsp bei var film="test" anführungszeichen verwenden. dann gilt natürlich wie bei den ' das du weitere " mit \" schreiben musst.
Mitglied: aliasmp3
aliasmp3 24.08.2007 um 09:12:42 Uhr
Goto Top
ach ja mir fällt da grad noch ne simpler lösung ein. mach einfah ne div box mit dem style="width:1px; height:1px;" und schreibst in diese div den gewünschten text. in der funktion gehst du dann einfach her und holst den text auch der "unsichtbaren" box und schreibt ihn in ne andere box rein. ich bin mir nur grad nich sicher in wieweit divs ne größe von 0x0 erlauben daher die 1x1. du kannst sie ja noch unten rechts positionieren so das man sie nicht erkennt wen man nicht im quellcode rumstochert.

document.getElementById("film").innerHTML=document.getElementById("unsicht_div_film").innerHTML;
Mitglied: leb0rtran
leb0rtran 25.08.2007 um 21:14:17 Uhr
Goto Top
hab das jetzt am mit der letzten idee von dir gemacht


in der css:


und html:


aber die 3 div boxen werden nich wie gewünscht "versteckt" dürch das 0px (bei 1px wars das selbe)


output is das


Artikeltyp:
Buch
Film
Sonstiges

blub BOOK
blub FILM
blub SONSTIGES
blub SONSTIGES


--> die Funktion etc is richtig, nur die 3 div boxen book, film, und sonstiges nich

wie kann ich die durch die css unsichtbar machen
Mitglied: aliasmp3
aliasmp3 26.08.2007 um 12:00:26 Uhr
Goto Top
ok ich hab die style css nochmal angepasst und es bei mir getestet.

#book
{

width: 1px;
height: 1px;
overflow:hidden;
}


#film
{
width: 1px;
height: 1px;
overflow:hidden;
}


#sonstiges
{
width: 1px;
height: 1px;
overflow:hidden;
}


zu der anderen datei:

du solltest dich ein wenig über html schlau machen

http://de.selfhtml.org/navigation/html.htm

das is ne ganz gute referenz für html, css und javascript

im folgenden der richtige aufbau. mit dem es bei mir auch funktioniert.

<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body onload="hide1();">
.......
</body>
</html>
Mitglied: leb0rtran
leb0rtran 26.08.2007 um 19:55:24 Uhr
Goto Top
kk
thx für deine hilfe

damit funktionierts ..
Heiß diskutierte Beiträge
question
Virtualisierungsprojekt für die FacharbeitVentimonusVor 1 TagFrageVirtualisierung16 Kommentare

Heyho, Ich habe mal ein paar fragen, bezüglich meines Abschlussprojektes, ob das alles überhaupt so Sinnig ist wie ich es mir denke. Kurz zur Erläuterung: ...

general
HomeServer noch mal anfassen?dertowaVor 1 TagAllgemeinServer-Hardware20 Kommentare

Hallo zusammen, erst im Juli dieses Jahres habe ich mein Homeserver-System angefasst und ein paar Upgrades vorgenommen. Der Threadripper 1920x wurde durch einen Ryzen 5 ...

question
Netzwerkperformance - Mikrotik - Wo ist mein Fehler?BirdyBVor 21 StundenFrageNetzwerke34 Kommentare

Moin zusammen, ich stehe gerade etwas auf dem Schlauch und weiß nicht so recht was mein Fehler ist. Gegeben ist mein heimisches Netzwerk: Also eigentlich ...

info
Hunderttausende MikroTik-Router sind seit 2018 angreifbarkilltecVor 1 TagInformationMikroTik RouterOS23 Kommentare

Mehrere MikroTik Router angreifbar. Hier der Link zu Heise: Hunderttausende MikroTik-Router sind seit 2018 angreifbar Gruß ...

question
Neue Firmennetzwerkstruktur und ein glühender KopfDerWachnerVor 1 TagFrageNetzwerke28 Kommentare

Moin zusammen, nun hab ich jahrelang hier nur mitgelesen, nun stehe ich allerdings selbst vor nem Problem was mir seit Tagen Kopfschmerzen bereitet. Also wir ...

general
Neue Herausforderungen auf unserer englischen SeiteFrankVor 21 StundenAllgemeinOff Topic13 Kommentare

Auf unserer englischen Seite gibt es neue Herausforderungen: Find who restarted DB server und Wanted: Network Node Manager 6.4 wer kann helfen? Generell findet ihr ...

question
Infos zu VOIP bzw. SIP gesucht gelöst lcer00Vor 1 TagFrageVoice over IP15 Kommentare

Hallo, kennt jemand vernünftige Einstiegslektüre (digital oder als Buch) zu VoIP, SIP & Co? Das Prinzip ist mir zwar eigentlich klar, aber gerade bei den ...

question
RDS CALs und normale CALs - Wie richtig lizensierentim.riepVor 1 TagFrageWindows Server18 Kommentare

Hallo liebe User, ich habe eine Frage zur richtigen Lizensierung: Wenn eine natürliche Person zum Beispiel drei Accounts auf einem Windows Server 2016 hat, braucht ...