jQuery: Dynamische Funktion aus Snippet machen

[Niklas Richter]

Hallo,

ich möchte diese jQuery-Funktion benutzen:

$(document).ready(function(){  
	  
$("a#animate").click().toggle(function(){$(this).next().animate({Height:'hide',opacity:'hide'},'slow');},function(){$(this).next().animate({Height:'show',opacity:'show'},'slow');});  
	  
});

HTML:

  
<div><a href="#" id="animate">open/close</a></div>  
<div id="block1" style="background:yellow;height:500px">Test</div>  
  
<div><a href="#" id="animate">open/close</a></div>  
<div id="block2" style="background:yellow;height:500px">Test</div>  
  
<div><a href="#" id="animate">open/close</a></div>  
<div id="block3" style="background:yellow;height:500px">Test</div>  
  
usw.

Wie kann ich jetzt obigen jQuery abändern, damit er nicht das nächste Element nimmt, sondern konkret eine ID? Und wie übergebe ich die an die jQuery-Funktion?

Ich meine etwa sowas:

  
function toggler(id)  
{...}

Danke!
Niklas

[molily]

$("a#animate").click().toggle(...

Das click() ist hier wohl zuviel.

<div><a href="#" id="animate">open/close</a></div>

Eine ID darf nur einmal im Dokument vorkommen. Suchst du vielleicht Klassen?

Wie kann ich jetzt obigen jQuery abändern, damit er nicht das nächste Element nimmt, sondern konkret eine ID? Und wie übergebe ich die an die jQuery-Funktion?

Vom Prinzip z.B. so:

<a href="javascript:toggler('foo')">Toggle Foo</a>

function toggler (id) {
   $("#" + id).machWasMitDemElement().animiereEsOderÄhnliches();
}

Wenn du die Handler zentral vergeben willst, musst du die ID anderweitig im Element unterbringen, z.B.

<a href="#id" class="toggler"></a>

Dann

$(document).ready(function () {  
  $(".toggler").toggle(function () {  
    var selektor = $(this).attr("href");  
    $(selektor).animate(... hide ...);  
  }, function () {  
    var selektor = $(this).attr("href");  
    $(selektor).animate(... show ...);  
  }  
  );  
});

Mathias