comment obtenir le texte de textarea en utilisant jQuery avec le caractère newline préservé?

Question

J'ai une zone de texte dans laquelle l'utilisateur entre le texte. Je souhaite récupérer le texte saisi par l'utilisateur, y compris le nouveau caractère de ligne automatiquement enveloppé. comment obtenir le texte de textarea en utilisant jQuery avec le caractère newline préservé?

Answer 1

Compte tenu de votre montage, il va être assez difficile, voire impossible de le faire avec précision. Le problème est que l'encapsulage automatique n'introduit pas de caractères de nouvelle ligne, c'est juste le navigateur qui affiche une chaîne sur plusieurs lignes ... Donc la seule façon de penser est d'essayer & d'écrire du code pour estimer où les nouvelles lignes étaient rendu en fonction de la largeur du textarea et les insérer manuellement.

Donc, avec cela à l'esprit si votre zone de texte ne dispose pas d'une largeur de CSS défini et vous utilisez l'cols="xx" attribut et vous utilisez une police de largeur fixe et vous avez toujours les barres de défilement montrant (ces effets la largeur de la zone de texte est rendu en fonction de cols), alors vous devrait être en mesure calculer le nombre de mots affichés sur une seule ligne avant qu'il ne soit enveloppé automatiquement par le navigateur en faisant quelque chose comme ceci:

//Based off <textarea id="text" cols="50" rows="5" style="overflow: scroll">This is a test sentence, with no newline characters in it, but with an automatically wrapped sentence that spans three lines.</textarea> 
var words = $("#text").val().split(" "); 
var cols = $("#text").attr("cols"); 
var text = ""; 
var lineLength = 0; 
for (var i = 0; i < words.length; i++) { 
    var word = words[i]; 
    if ((lineLength + word.length + 1) > cols) { 
     text += "\n"; 
     lineLength = 0; 
    } else if (lineLength > 0) { 
     text += " "; 
     lineLength++; 
    } 
    text += word; 
    lineLength += word.length; 
} 
alert(text); 
//Alerts: 
//This is a test sentence, with no newline 
//characters in it, but with an automatically 
//wrapped sentence that spans three lines. 

Cependant, c'est beaucoup de si s, et je ne sais pas comment cela fonctionnerait dans tous les navigateurs (je l'ai testé & il semble fonctionner dans Firefox 3.6) ...

également notez que si vous suivez cette route, que mon code de retour de mot est très rudimentaire et qu'il est pratiquement garanti de ne pas correspondre à ce que fait le navigateur dans tous les cas, vous devrez peut-être développer en fonction de vos besoins. Par exemple, les mots plus longs que la longueur cols sont divisés par firefox, mais pas par mon code.

Answer 2

Vous devez remplacer le "\ n" par des balises br ou placer le contenu en avant pour afficher les lignes suivantes.

Voici un exemple de code:

en supposant que vous avez votre balisage de la page comme ceci:

<div id="res"></div> 
<textarea id="txtarea"></textarea> 
<button id="btn">go</button> 

alors c'est le code jquery:

$(document).ready(function() { 
    var btn = $('#btn'); 
    var txtarea = $('#txtarea'); 
    var result = $('#res'); 
    btn.click(function() { 
     var val = txtarea.val().replace(/\n/g, '<br/>'); 
     result.html(val); 
     return false; 
    }); 
}); 

J'espère que cela aide.

Answer 3

I want to keep automatically wrapped newlines.

Vous ne pouvez pas faire cela, parce qu'il n'y a pas de sauts de ligne là. Le contrôle Textarea fait l'emballage visuel pour vous. Il n'y a pas de nouvelles lignes, sauf si vous les tapez.