ID automatisch erzeugen und an zwei Stellen einfügen

susiH · 04.07.2016

Hallo,

ich arbeite gerade an einem Newsscript für Contao und ich stehe mal wieder auf dem Schlauch.

Ich möchte eine ID erzeugen, die an zwei Stellen eingefügt wird. Wenn das Script wieder durchläuft, um die nächste News zu erzeugen, soll eine andere ID erzeugt werden. Nur, es ist halt wichtig, dass bei einem Scriptdurchlauf eine ID erzeugt wird und sie an zwei Stellen eingefügt wird.

Hier mal ein Schnipsel:

Code:

<a onclick="return toggleMe('hier_soll_die_ID_stehen')" href="javascript:void(0)">  <button>&#187; mehr</button></a>

<div style="display:none;" class="dbox" id="hier_soll_die_ID_stehen">
.....
</div>

Danke schon mal im Voraus für eure Hilfe

Myhar · 04.07.2016

Wieso wrappst dun einen button mit einem a-tag? Du kannst das onclick auch auf den button legen. Und wieso brauchst du dafür eine ID? Im Idealfall ist der "mehr ..." Bereich sowieso relativ zum button vorhanden, so dass man von dort aus direkt darauf zugreifen kann (wie zB mit jQuery .next() oder so) Auch solltest du keine inline-onclick Handler verwenden sondern jedem mehr-button eine Klasse vergeben und dann einfach auf jeden Button den JS-Handler binden. Und dann eben bei jedem Button das Selbe machen (zB das .next() Element einblenden )

susiH · 06.07.2016

Hallo Myhar,
Danke erstmal für deine schnelle Antwort. Ich versuche mal zu erklären, was ich vorhabe... Und verzeih mir bitte den Button-Fehler... Sowas passiert mir bei copy paste Sachen...

Also: ich möchte eine Nachricht ausgeben.
Überschrift
Anleser
Mehr-Button
Rest der Nachricht

Der Rest der Nachricht ist erstmal versteckt. Beim Klick auf "mehr" öffnet sich einfach ein accordeon, der den Rest der Nachricht einblendet.
Deswegen brauche ich eine eindeutige ID, die den Nachrichtentext umschließt und die gleiche halt im Button, damit sich beim Klick auf "mehr" auch das richtige accordeon öffnet.

Myhar · 07.07.2016

Nein, da brauchst du keine eindeutige ID. Ich erkläre es gerne nochmal: Du weißt wo dein button ist und dein "versteckter" Text ist in einem span /div mit der Klasse hidden. Klickst du auf den Button dann musst du in jQuery zB nur $(this).next().toggleClass("hidden") machen und schon hast du das nächste Element eingeblendet. Das .next() kann natürlich auch an den HTML-Aufbau angepasst werden.

Code:

<h1> Ich bin eine Überschrift </h1>
<p>
Das its der sichtbare Text der hier in dem Absatz steht. 
<button> einfach nur "Mehr" in einem Button sollte tunlichst vermieden werden! </button>
<span class="hidden"> Ich bin ein versteckter Text, der erst bei Klick auf den Button eingeblendet wird </span>
</p>