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

[face2000]

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

<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>

$(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.

 

[Myhar]

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.

<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>

$('.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]

 

[Fugel]

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.

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

$('.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]

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.

 

[face2000]

#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

(this)fadeToggle

nutze

Du hast richtig erkannt

class="weiter"

du hast die 1 schon mal entfernt. Das ist ein guter Ansatz.

Magst du mir weiter helfen?
LG

 

[face2000]

Schade, dass mir jetzt nicht mehr geholfen wird.

 

[owieortho]

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.

 

[Myhar]

Magst du mir weiter helfen?

Womit? Ich habe dein Problem schon gelöst.
Ansonsten: Lies den Beitrag von @owieortho

 

[face2000]

• 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.

 

[Myhar]

Erm, da sind so viele widersprüchliche Punkte, die du geannant hast.

Welche denn?

 

[Fugel]

Wo kommen die Leute nur immer wieder her?

 

[Curanai]

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.

 

[owieortho]

@Curanai,
we just met a better idiot....
Es war mein Fehler überhaupt zu reagieren. (s. a. https://www.psd-tutorials.de/forum/threads/responsive-html-seite-ios-apple-hack.174119/)
Dir auch ein schönes Wochenende
O.