So implementieren Sie einen Link "mehr lesen" mit jQuery

8

Ich möchte in der Lage sein, eine verkürzte Version eines langen Textfelds standardmäßig anzuzeigen, aber dann einen Link "mehr lesen", der das Feld auf seine Vollversion erweitert. Ich habe gerade ein ziemlich einfaches Setup, aber ich finde, dass es einen effizienteren Weg dafür geben sollte.

Hier ist mein aktueller Code:

%Vor%

Das funktioniert, wirkt aber klobig. Zum Beispiel wäre es schön, wenn der Originaltext nicht flimmert oder kurz verschwindet, sondern sich einfach ausdehnt. Irgendwelche Vorschläge?

    
tchaymore 24.08.2010, 03:10
quelle

4 Antworten

23

Dafür gibt es ein Plugin. Erfinde das Rad nicht neu.

    
Stefan Kendall 24.08.2010, 03:12
quelle
8

Von jQuery-Rezepte :

%Vor%     
rebelliard 24.08.2010 03:25
quelle
1

Sie könnten den Text in ein div einfügen und den ersten Teil direkt in den div

einfügen %Vor%

In Jquery machen Sie so etwas:

%Vor%

Die Jquery-Referenz ist hier .

    
Muffun 24.08.2010 03:19
quelle
1

Überprüfen Sie diese Plugins. Sie können dies leicht tun.

jQuery Expander

Readmore.js

Einfache Jquery- und CSS-Nutzung.Nicht das Plugin

    
Sumith Harshan 19.10.2013 20:55
quelle

Tags und Links

Django: Verwenden von Annotate, Count und Distinct in einem Queryset ___ answer3239253 ___

Dies würde wahrscheinlich passieren, wenn die Seite Javascript oder %code% verwendet, um auf eine andere Seite umzuleiten.

Wenn ja, gibt es keine gute Problemumgehung.

    
___ qstntxt ___

Ich habe dieses Thema recherchiert und alle scheinen zuzustimmen, dass die Lösung darin besteht, das %code% des Webbrowsers zu überprüfen, bis die Einstellung abgeschlossen ist.

Aber tatsächlich wird das Ereignis manchmal mit dem %code% ausgelöst, das mehrmals auf Complete gesetzt wurde.

Ich glaube nicht, dass es eine Lösung mit diesem fehlerhaften .NET Webbrowser gibt, aber es könnte einen geben, wenn ich die zugrunde liegende DOM-Komponente verwende.

Das einzige Problem ist, ich habe keine Ahnung, wie ich auf die DOM-Komponente hinter dem WebBrowser zugreifen kann, die das DocumentCompleted-Ereignis auslöst.

    
___ tag123c ___ C # (sprich "Cis") ist eine objektorientierte Programmiersprache auf hohem Niveau, die für die Erstellung einer Vielzahl von Anwendungen entwickelt wurde, die auf dem .NET Framework (oder .NET Core) ausgeführt werden. C # ist einfach, leistungsfähig, typsicher und objektorientiert. ___ tag123net ___ Das .NET-Framework ist ein Software-Framework, das hauptsächlich für das Microsoft Windows-Betriebssystem entwickelt wurde. Es enthält eine Implementierung der Basisklassenbibliothek, Common Language Runtime (allgemein als CLR bezeichnet), Common Type System (allgemein als CTS bezeichnet) und Dynamic Language Runtime. Es unterstützt viele Programmiersprachen, einschließlich C #, VB.NET, F # und C ++ / CLI. NICHT für Fragen zu .NET Core verwenden. ___ answer38057856 ___

Ich kann nichts finden, was 100% Sicherheit gibt. Das erwähnte Beispiel (e.Url.Equals (webBrowser1.Url)) funktioniert möglicherweise für einen einfachen WebBrowser.Navigate (url), aber in meinem Fall klicke ich auf Knoten im Code, um neue Rahmen in bestehenden Rahmen zu öffnen. Meistens ist die Anzahl der Male "Navigating" und "DocumentCompleted" gleich, aber auch nicht immer. "isBusy = false" und "ReadyState = Complete" wird immer der Fall sein, wenn es fertig ist (zumindest bis jetzt), aber es wird auch einige Male diesen Zustand haben, wenn es noch lädt. Das Zählen von Frames erscheint mir auch nutzlos, in einem Fall wird DocumentCompleted 23-mal ausgelöst, jedoch sind alle Frames und Sub-Sub-Sub-Frames 14 insgesamt.

Das Einzige, was zu funktionieren scheint, ist eine kurze Zeit (1 oder 2 Sekunden?) abzuwarten, um zu sehen, ob etwas passiert (irgendwelche Ereignisse ausgelöst, irgendwelche Statusänderungen).

Hmm, ich habe eine andere Lösung für mich gefunden. Oft sind wir nicht daran interessiert, die ganze Seite zu laden, oft wollen wir, dass bestimmte Elemente existieren. Also nach jedem DocumentCompleted und wenn "isBusy = false" und "ReadyState = Complete" können wir das DOM durchsuchen, wenn dieses Element existiert.

    
___