Antworten auf deine Fragen:
Neues Thema erstellen

jQuery - ich möchte den Text im Link per Klick ändern - if else etc.

F

face2000

Guest

Hallo PSD Tutorials Community,

Ich baue zur Zeit einen Blog. Wenn Jemand auf den Link "Artikel lesen" klickt, öffnet sich die Box und wird größer. Gleichzeitig ändert sich der Text im Link: "Artikel lesen" in "Artikel schliessen". Das funktioniert mit meinem jQuery Code auch wunderbar, aber sobald ich erneut auf den Link klicke, möchte ich, dass es wieder in "Artikel lesen" umgeändert wird. Kann mir das Jemand helfen?

Beste Grüße

HTML:
<p id="flow">
   Hier Steht ein Beispiel Text <spanstyle="color:orange">"Orange"</span> Klicke ich auf den Link "bluechen". Soll sich der Text innerhalb ändern<br/>
  <span class="weiter1">
   Dann klappt noch ein Text auf.
  <br/>
</span>
<a href="javascript:void(0)" class="bluechen">Artikel lesen</a>
</p>

Code:
$(document).ready(function(){
  $(".bluechen").click(function(){
    $(".weiter1").fadeToggle();
    $(this).text('Artikel schliessen');
   });
})

Kann mir bitte Jemand helfen?

Edit: Leider kann ich den Prefix nicht ändern hat sich aber erledigt.
 
Zuletzt bearbeitet von einem Moderator:

Myhar

Hat es drauf

Du musst den Code für dein Auf- Zuklappen neu schreiben, so wie du das hier hast funktioniert es nur wenn genau ein Beitrag (und nicht mehrerere) sichtbar sind.
Auch solltest du den HTML-Code überarbeiten, du hast hier keinen Link sondern einen button. Ein Link führt woanders hin, ein button führt eine Aktion aus.

Code:
<p class="article-text"> 
Text Lorem Ipsum
<span class="weiter">Mehr Text </span>
<button type="button" class="toggle-article" data-text-show="Artikel lesen" data-text-hide="Artikel ausblenden" > Artikel lesen </button>
</p>

Code:
$('.toggle-article').on('click', function() {
  const $this = $(this);
  const text = $this.hasClass('shown') ? $this.data('text-show') : $this.data('text-hide');
  $this.toggleClass('shown').html(text);
  $this.closest('.article-text').find('.weiter').slideToggle();
});
[CODE]
 
Zuletzt bearbeitet:

Fugel

rebmeM

PSD Beta Team
Du musst den Code für dein Auf- Zuklappen neu schreiben, so wie du das hier hast funktioniert es nur wenn genau ein Beitrag (und nicht mehrerere) sichtbar sind.
Auch solltest du den HTML-Code überarbeiten, du hast hier keinen Link sondern einen button. Ein Link führt woanders hin, ein button führt eine Aktion aus.

Code:
<button type="button" class="toggle-article" data-text-show="Artikel lesen" data-text-hide="Artikel ausblenden" > Artikel lesen </button>

Code:
$('.toggle-article').on('click', function() {
  const $this = $(this);
  const text = $this.hasClass('shown') ? $this.data('text-show') : $this.data('text-hide');
  $this.toggleClass('shown').html(text);
});
[CODE]
Da warst du wieder mal schneller ;)
 

Myhar

Hat es drauf

Naja, ich habe vergessen das togglen des Textes zu berücksichtigen, habe im ersten Entwurf nur den Text des buttons geändert. Ist jetzt aber auch angepasst, jetzt sollte der Text auch ein- und ausgeblendet werden (für beliebig viele Elemente)

Was ich mich noch frage: Warum baut man ein blogsystem und nimmt nicht ein schon fertiges wie zB wordpress? Der Eigenbau kann niemals so sicher und durchdacht sein wie so ein etabliertes System.
 
F

face2000

Guest

#Myhar
Ich mag Wordpress nicht so gerne. Ich weiß worauf Du hinaus möchtest. Soll ja eine Blogseite sein. Aber ich möchte jQuery lernen und mir die Arbeit nicht vereinfachen und schon gar nicht ersparen. Harte Arbeit wird belohnt und ich sitze schon ziemlich lange daran.

Du hast im Übrigen recht. Ich möchte nicht für jede Box einen weitere Klassifizierung für das aufklappen derBoxen erstellen.
Besser wäre es, wenn ich
Code:
(this)fadeToggle
nutze

Du hast richtig erkannt
Code:
class="weiter"
du hast die 1 schon mal entfernt. Das ist ein guter Ansatz.

Magst du mir weiter helfen?
LG
 

owieortho

Aktives Mitglied

Schade, dass mir jetzt nicht mehr geholfen wird.
  • Keine 12 Stunden nach Deinem Eröffnungspost, hast Du schon drei Antworten,
  • da die meisten hier wohl im deutschsprachigen Raum leben, werden die allermeisten zum Zeitpunkt Deines letzten Posts schlafen und morgens drauf auch arbeiten gehen,
  • dieses Forum ist in erster Linie auf Bildbearbeitung und nur peripher auf Programmierung fokussiert, daher schätze ich die Dichte an Menschen, die Dir antworten können als geringer ein als bei Bildbearbeitungsthemen
Vor diesem Hintergrund halte ich es für verfrüht bzw. unangebracht, sich derart zu beklagen.
O.
 
F

face2000

Guest

  • Keine 12 Stunden nach Deinem Eröffnungspost, hast Du schon drei Antworten,
  • da die meisten hier wohl im deutschsprachigen Raum leben, werden die allermeisten zum Zeitpunkt Deines letzten Posts schlafen und morgens drauf auch arbeiten gehen,
  • dieses Forum ist in erster Linie auf Bildbearbeitung und nur peripher auf Programmierung fokussiert, daher schätze ich die Dichte an Menschen, die Dir antworten können als geringer ein als bei Bildbearbeitungsthemen
Vor diesem Hintergrund halte ich es für verfrüht bzw. unangebracht, sich derart zu beklagen.
O.




Erm, da sind so viele widersprüchliche Punkte, die du geannant hast, da empfindet man schon ein leichtes Fremdschämen.
Antwort: Öhm, nö. Ist mir zu blöd. Wünsche euch viel Spaß in diesem "weird" Forum und eurer PSD-Tutorials GmbH.

Und verschone mich mit deinen Antworten.
 

Curanai

Aktives Mitglied

Boah, da bin ich 1x nicht da und endlich kommt so'n Alpha-Kevin mal hier rein ... ! Sorry, hatte echt sehr viel zu tun in den letzten Wochen. Vielleicht sollte man an die Postings zukünftig 'ne Flag setzen können:
[ 1 ] suche Denkanstoß
[ 2 ] nehme nur mundfertige Lösungen

Leute, ich wünsch euch 'nen schönes, feines, Kevin-freies Wochenende.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.611
Beiträge
1.538.341
Mitglieder
67.524
Neuestes Mitglied
BSKGA
Oben