Ajoutez des sauts de ligne une fois que deux conditions sont remplies : pas plus de "x" caractères et se terminant par une virgule ou un point.
Je travaille sur un petit projet.
Le but de ce projet est de supprimer le formatage (doubles espaces, nombres et nouvelles lignes), puis d'afficher la valeur avec un saut de ligne tous les "x" caractères, mais assurez-vous qu'elle se termine par une virgule ou un point.
Par exemple... si je fixe la limite de caractères à 50 (après le "l" dans "jusqu'à"), je veux que cela ressemble à ceci. Notez que l'exemple privilégie la ponctuation par rapport aux limites de caractères, mais il n'ajoutera pas de nouvelles lignes à moins que vous ne soyez au moins proche de la limite de caractères (j'ai ajouté des virgules supplémentaires pour expliquer davantage) :
« Le renard brun agile a sauté par-dessus le chien paresseux,
Jusqu'à ce que le chien s'endorme. »
au lieu de (limite de caractères) :
«Le renard brun agile a sauté par-dessus le chien paresseux jusqu'à
Le chien dort. »
ou (point de ponctuation) :
"Dépêchez-vous,
Le renard brun saute par-dessus le chien paresseux,
Jusqu'à ce chien,
Endormi. »
Si vous voulez que mon code actuel (suppression des doubles espaces, des chiffres et des nouvelles lignes) fonctionne...
<script>
function printText() {
var inputValue = document.getElementById("paste-text").value;
function editText() {
inputValue = inputValue.replace(/(\r\n|\n|\r)/g, ' ');
inputValue = inputValue.replace(/[0-9]/gm, ' ');
inputValue = inputValue.replace(/(\s\s\s\s)/gm, ' ');
inputValue = inputValue.replace(/(\s\s)/gm, ' ');
inputValue = inputValue.trim();
return inputValue;
}
if (inputValue.length > 0) {
document.getElementById("text-output").innerText = editText();
document.getElementById("edit-text-output").classList.add("showEdited");
}
}
</script>
<section>
<div class="edit-text-container">
<div class="edit-text-input">
<div class="edit-text-paste">
<h3>Paste Text</h3>
<div class="edit-text-input-area">
<textarea name="paste-text" id="paste-text" rows="6" placeholder="Paste Text Here"></textarea>
</div>
<input type="submit" value="Remove Formatting" onclick="printText()">
</div>
</div>
<div id="edit-text-output">
<h3>Your <i>edited</i> Text</h3>
<div class="edit-text-output-area">
<textarea readonly id="text-output" rows="6"></textarea>
</div>
</div>
</div>
</section>
<style>
textarea {
margin:0;
width:100%;
padding:16px; }
#edit-text-output {
height:0px;
overflow:hidden;
opacity:0;
transition: all 0.5s;}
.showEdited {
height:185px!important;
opacity:1!important; }
.edit-text-container {
justify-content:center;
text-align:center; }
input[type=submit] {
margin-top:16px; }
</style>
Encore une fois, il s'agit d'un projet personnel, alors ne vous précipitez pas pour trouver une solution/si ce n'est pas possible, ce n'est pas grave.
J'ai essayé d'exécuter des instructions if/else de base via Javascript sans succès. J'ai une compréhension de base de jQuery et Javascript, je peux donc être limité par mon manque de connaissances.
En cherchant une solution, j'ai compris comment créer une nouvelle ligne aux limites de caractères et une nouvelle ligne à la ponctuation, mais pour une raison quelconque, je n'ai pas compris comment créer une nouvelle ligne à la ponctuation.
