Skriptsprachen (PHP, Javascript, etc.) - Forum

Derzeit sind Sie als Gast in unserem Forum aktiv. Für das Schreiben registrieren Sie sich bitte. Unser Forum ist eine Austauschplattform für Webworker zum Kommunizieren, Helfen, Informieren und Hilfe finden. Auf der rechten Seiten finden Sie eine Forenübersicht über alle Bereiche des Webmaster-Forums. Unterhalb finden Sie alle aktuellen Themen.

Diskutieren Sie hier über die serverseitige Skriptsprachen PHP und Python und über dynamische Webseitenerstellung mit Javascript und Ajax.


SandraN
Beiträge: 1

PN schreiben
Profil ansehen
User ist offline

[jquery] show/hide variable divs

Link zur Antwort auf "[jquery]  show/hide variable divs" von SandraN SandraN, am Montag den 26.10.2009 um 11:03:00

Hallo, bin totale Anfängerin, deshalb ist meine Frage vielleicht auch etwas seltsam formuliert. Ich hoffe trotzdem Ihr versteht, was ich meine.

In meiner HTML Datei habe ich verschiedene Divs (die tauchen später als Popups auf), die alle so aussehen (mit unterschiedlichem Namen):

 
HTML
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<div id="2schrift" style="visibility: hidden;">
    <div id="fade"></div>
    <div class="popup_block">
        <div class="popup">
            <a href="javascript:hideDiv('2schrift')"><img src="icon_close.png" class="cntrl" title="Close"></a>
            <h3>Schrift</h3>
      <img src="1schrift.jpg" class="floatLeft">
      <img src="2schrift.jpg" class="floatLeft">
      <p>Eu
      refero pertineo vulpes, molior, vel. Mos paulatim lobortis sed pneum
      antehabeo, tristique damnum dolor venio mauris, decet sudo, ibidem
      lucidus. </p>
        
        </div>
    </div>
</div>

Die divs werden angezeigt, wenn zwei gleiche Bilder angeklickt werden (wie bei Memory). Die Bilder heißen immer z.B. "1schrift.jpg" und "2schrift.jpg". Wenn zwei gleiche angeklicht werden passiert das:

Teil 1  
JavaScript
1
showDiv(imgName.replace(1,2));

Damit wird die Zahl vorne immer in eine 2 umgewandelt, da meine divs alle mit 2 vorne heißen.

Die Funktion showDiv sieht so aus (hideDiv ist dann das genau Gegenteil):

Teil 2  
JavaScript
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
function showDiv(id) { 
if (document.getElementById) { // DOM3 = IE5, NS6 
document.getElementById(id).style.visibility = 'visible'; 
} 
else { 
if (document.layers) { // Netscape 4 
document.hideshow.visibility = 'visible'; 
} 
else { // IE 4 
document.all.hideshow.style.visibility = 'visible'; 
} 
} 
}

Das funktioniert auch alles. Jetzt würde ich das ganze aber gerne mit jquery vereinfachen und dachte ich könnte dafür show und hide benutzen und mir damit Teil 2 komplett sparen. Wenn ich jetzt aber schreibe:

 
JavaScript
1
§('imgName.replace(1,2)').show();

dann tut es nicht. habe alle möglichen Anführungszeichen und auch # vor dem Namen in der Klammer ausprobiert. Kann ich da in die Klammer nur die festen Namen reinschreiben? Es funktioniet nämlich, wenn ich z.B. schreibe $('#2schrift').show();.

Wäre schön, wenn jemand einen Hinweis für mich hätte!! Danke!

Link zur Antwort auf "[jquery]  show/hide variable divs" von BuddhaOhneHals  BuddhaOhneHals , am Montag den 26.10.2009 um 12:06:32

Ich benutze kein jQuery, aber ein Blick in die Doku sagt mir, dass es so gehen sollte

 
JavaScript
1
$('#' + imgName.replace(1,2)).show();

Du hattest dagegen versucht, ein Element mit der Id "imgName.replace(1,2)" zu finden, was es so nicht gibt.


Benutzer gelöscht
Beiträge: 166

PN schreiben
Profil ansehen
User ist offline
Link zur Antwort auf "[jquery]  show/hide variable divs" von Benutzer gelöscht Benutzer gelöscht, am Montag den 26.10.2009 um 22:37:30
Zitat von: SandraN

Damit wird die Zahl vorne immer in eine 2 umgewandelt, da meine divs alle mit 2 vorne heißen.

Das gibt aber keine gültigen IDs - IDs müssen mit einem Buchstaben beginnen, eine Zahl darf ganz vorne nicht stehen. Die meisten Browser dürften eine Zahl am Anfang zwar akzeptieren, allerdings solltest du die entfernen um die potentielle Problemquelle auszuschließen.

Zitat von: SandraN

Die Funktion showDiv sieht so aus (hideDiv ist dann das genau Gegenteil):

Das funktioniert auch alles. Jetzt würde ich das ganze aber gerne mit jquery vereinfachen und dachte ich könnte dafür show und hide benutzen und mir damit Teil 2 komplett sparen. Wenn ich jetzt aber schreibe:

 
JavaScript
1
§('imgName.replace(1,2)').show(); 

Du suchst nach einem Element namens imgName das die Klasse »replace(1,2)« hat - dieses Element gibt es natürlich nicht. Wie BuddhaOhneHals schon richtig geschrieben hat, sollte es funktionieren wenn du auf den Wert von imgName.replace(1,2) zugreifst und mit einem + das '#' davor hängst. Darüber wie jQuery arbeitet (Zugriff auf Elemente mit CSS-Selektoren) bist du dir im klaren, oder?