✔ [jQuery] .slideToggle() und src von Image ersetzen

[Johnnii360]

Servus zusammen!

Da mir mein Beitrag im jQuery-Forum leider nicht freigeschalten wird, wende ich mich mal an Euch hier.

Und zwar möchte ich gerne eine Grafik ersetzen, sobald der .slideToggle()-Befehl ausgeführt wird. Hier habe ich einmal eine Plus- und eine Minus-Grafik. Standardmäßig ist der div im style-Tag mit "display: none;" gekennzeichnet und gibt erst den Inhalt preis, bei einem Klick auf der Plus.
Nachdem dann der slide erfolgte, soll das Plus in ein Minus geändert werden. Ich habe auch schon viel rumprobiert, es hat aber leider alles nichts geholfen.

Dabei habe ich folgenden Code:

<script type="text/javascript">
$('#i<?php echo $jahr['archiv_date_year'];?>').click(function() {
  $('#d<?php echo $jahr['archiv_date_year'];?>').slideToggle('slow', function() {
	if ($('#d<?php echo $jahr['archiv_date_year'];?>').style.display == 'none')
	{
		$('#i<?php echo $jahr['archiv_date_year'];?>').src = 'icons/toggle_minus.png';
	}
	else
	{
		$('#i<?php echo $jahr['archiv_date_year'];?>').src = 'icons/toggle_plus.png';
	}
  });
});
</script>

Firefox gibt mir immer aus (Fehlerkonsole), d2010 und i2010 nicht definiert wären, für die if-Schleife.

Ich würde mich sehr über Eure Hilfe freuen.

Vielen Dank im Voraus!

 

[CPoly]

1. Da steht PHP-Code in deinem JavaScript. Das trägt zur Sache nichts bei und macht es uns schwer es zu lesen
2. Meines Wissen nach hat ein jQuery Objekt weder die Eigenschaft "style" noch die Eigenschaft "src"

Versuch es mal so

<script type="text/javascript">
$('#i<?php echo $jahr['archiv_date_year'];?>').click(function() {
  $('#d<?php echo $jahr['archiv_date_year'];?>').slideToggle('slow', function() {
	if (!$(this).is(":visible"))
	{
		$('#i<?php echo $jahr['archiv_date_year'];?>').attr("src", "icons/toggle_minus.png");
	}
	else
	{
                $('#i<?php echo $jahr['archiv_date_year'];?>').attr("src", "icons/toggle_plus.png");
	}
  });
});
</script>

 

[Johnnii360]

Danke Dir!

Ich sehe aber gerade, dass es nur nach einem zweiten Klick geht, wenn ich die aufgeklappte Tabelle wieder einklappe. Es sollte aber schon beim ersten Klick in ein Minus gewandelt werden.

Ich könnte aber auch alles nochmal neu definieren:

var klappImages = document.getElementById('i<?php echo $jahr['archiv_date_year'];?>');
var klappDIV = document.getElementById('d<?php echo $jahr['archiv_date_year'];?>');

if(klappDIV.style.display = 'none')
{
    klappImages.src = 'icons/toggle_plus.png';
}
else
{
    klappImages.src = 'icons/toggle_minus.png';
}

Müsste es aber erst testen. Hoffentlich kommt der Code dann nicht mit jQuery in Konflikt.

Btw. die PHP-Variable definiert nur in der for-Schleife das ausgelesene Jahr, sodass jede ausklappbare Tabelle eine eigene ID hat.

Edit: Ne, ****t leider auch nicht.

 

[CPoly]

Tausch bei meinem Code mal den If- mit dem Else-Block, weil im Moment wird ein Minus angezeigt, wenn es unsichtbar ist (Ich habe es so aus deinem Startpost übernommen).

 

[Johnnii360]

Ah super, vielen Dank, hat geklappt!