web-dev-qa-db-fra.com

troncature de texte jquery (lire plus de style)

Ma question est très similaire à " Texte couper à 340 caractères " mais dans jQuery . Cela semblait très simple, mais quand j'ai cherché autour de moi, je ne pouvais trouver aucune référence pour cela.

OK, j'ai une div $('#content') Je veux couper le texte sur "x" la quantité de caractères permet de dire '600' [~ # ~ # ~] ] Je ne veux pas qu'il se brise le mot lui-même! Comme non ' Les questions ...' mais 'Les questions ... '.

Qu'advient-il de ce qu'il arrive au reste du texte? Eh bien, je le cache et je le montrerai sur demande! Mais attendez, il devrait d'abord supprimer le "... 'et montrez le texte juste après avoir hid.

Voici la structure d'échantillonnage pour $ ('# Content'):

<div id="content">
    <p>Once upon a midnight dreary, while I pondered weak and weary,Over many a quaint and curious volume of forgotten lore.</p>
    <p>Writing example text is very boring.</p>
    <p>Specially when you are dumb enough not to copy and paste. Oh!</p>
    <p>Once it sheltered the rogues and rapscallions of the British Empire; now Kangaroo Island is ready and waiting for some derring-do of your own. Venture into the rugged wilds of the island, traversing untamed bushland and pristine beaches seeking out seal, penguin and sea lion colonies. Meet the land loving locals - koalas, goannas, echidnas and the island's own species of kangaroo. </p>
</div>

comment il devrait charger:

Il était une fois minuit, alors que je réfléchis à la faiblesse et à la fatigue, sur beaucoup de volume pittoresque et curieux d'une tradition oubliée.

Exemple d'exemple Le texte est ... [En savoir plus]

Après avoir cliqué sur 'En savoir plus':

Il était une fois minuit, alors que je réfléchis à la faiblesse et à la fatigue, sur beaucoup de volume pittoresque et curieux d'une tradition oubliée.

Exemple d'exemple Le texte est très ennuyeux.

Spécialement quand vous êtes assez stupide pour ne pas copier et coller. Oh!

Une fois qu'il abritait les voleurs et les raccadres de l'empire britannique; Maintenant, Kangaroo Island est prêt et en attente de votre propre do. S'envirez dans les sauvettes de l'île, traversant des plages brutales indomptes et des plages vierges qui recherchent des colonies de phoque, de pingouin et de lion de mer. Rencontrez les habitants de la terre - Koalas, Goannas, Echidnas et la propre espèce de kangourou de l'île.

Mise à jour: J'ai trouvé ces deux plug-ins fondamentalement le même travail que cette meilleure réponse. Cependant, la meilleure réponse a des fonctionnalités que ces plug-ins ne possèdent pas et vice versa!

jquerytexttrim
23
Mazzi

Les travaux suivants pour limiter la quantité de texte si cela ne vous dérange pas de perdre les balises de paragraphe.

<script type="text/javascript">
var shortText = $("#content").text()    // get the text within the div
    .trim()    // remove leading and trailing spaces
    .substring(0, 600)    // get first 600 characters
    .split(" ") // separate characters into an array of words
    .slice(0, -1)    // remove the last full or partial Word
    .join(" ") + "..."; // combine into a single string and append "..."
</script>
22
Tim R

Eh bien, il y a un plugin pour cela. JQuery Expander .

13
Teja Kantamneni