Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
function mit ID-Serie
#1
Hallo zusammen,
ist es möglich eine einmal aufgeführte Funktion mit unterschiedlichen onclick Links zu nutzen?

Um Inhalte nachzuladen, habe ich jede Überschrift mit einem Link und folgendem onclick: ($2 - kommt von PHP)
Code:
onclick="lade_'.$2.'"()


Bei 5 Überschriften habe ich dann 5 mal:
Code:
<script>
$.get('../URL', function(data){";
    $('#lade".$2."').html(data);";
})";
</script>


<div id="lade'.$2.'">  Zeigt nachgeladenen Inhalt für Überschrift X</div>

Es funktioniert so prima, doch bei viel Inhalt zB. 100 Überschriften habe ich 100 mal den unteren Teil zum nachladen.
Ist es möglich den unteren Teil nur einmal auszugeben und mit einer ID oder so anzusprechen?
Zitieren
#2
Mal sehen ob ich das richtig verstehe: Du hast da eine Menge Überschriften und jeder dieser Überschriften ist genau ein div-Container zugeordnet. Klickt man jetzt auf eine dieser Überschriften, so wird mit $.get von einer URL ein HTML geladen und in den Container eingetragen, der dazu gehört. Richtig?
Frage: Es wäre wenig plausibel wenn die URL immer die selbe wäre, dann würde ja immer das selbe HTML geladen? Ich würde erwarten, dass die URL jedes Mal unterschiedlich ist oder dass sie jeweils mit unterschiedlichem GET-Parameter aufgerufen wird.
Glaube denen, die die Wahrheit suchen, und zweifle an denen, die sie gefunden haben.
(Andrι Gide (1869-1951), frz. Schriftst., 1947 Nobelpreis)
Zitieren
#3
Hallo,
ja die Links/URLS sind selbstverständlich unterschiedlich ;-)
Sorry wenn ich mich falsch ausgedrückt habe.

Ich habe eine PHP for-Schleife, $2 ist eine ID (PHP-Variable) des Datensatzes womit die Urls differenziert werden.

Mein Ziel ist das DIV, worin der nachzuladende Inhalt dann mit der JS-Funktion eingebunden wird und die JS-Funktion zum nachladen selbst, nur ein einziges mal nach der for-Schleife, einzubinden.
Zitieren
#4
Guten Abend,
solch ein Problem hat man häufig und es ist auch kein Problem, das zu realisieren ohne den Code zu vervielfachen. Lege die variablen Parameter, also dieses $2 und die URL als data-Attribute bei den Überschriften ab. Im Eventlistener liest Du diese dann aus und kannst damit die nötigen Aktivitäten ausführen. Würde dann in etwa so aussehen, ungetestet hingeschrieben:
Code:
<h4 class="h-clickable" data-id="$2" data-url="$die_url_zum_holen_des_html">Überschrift 1</h4>
<h4 class="h-clickable" data-id="$2" data-url="$die_url_zum_holen_des_html">Überschrift 1</h4>
<h4 class="h-clickable" data-id="$2" data-url="$die_url_zum_holen_des_html">Überschrift 1</h4>
<!-- Die Wiederholung entsteht natürlich durch eine Schleife im PHP -->
<div id="anzeige"></div>
<script>
    $('h4.h-clickable').on('click', function(event) {
        const
            id = $(this).data('id);
            url = $(this).data('url');
        $.get(url, function(data) {
            $('#anzeige').html(data);
        });
    });
</script>
Möglicher Weise ist es nicht nötig, die vollständige URL abzulegen, sondern nur einen variablen Bestandteil, aber das kannst Du dir sicher selbst überlegen.
Glaube denen, die die Wahrheit suchen, und zweifle an denen, die sie gefunden haben.
(Andrι Gide (1869-1951), frz. Schriftst., 1947 Nobelpreis)
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen:
1 Gast/Gäste