Comment puis-je convertir des <br> string en HTML <br> à l'aide de jQuery?

Peut-être que la question est formulée de manière incorrecte, mais ici, c'est ce que j'essaie de faire avec jQuery:

Point De Départ:

This is<br><br> some<br> <br> <br> <br> content

Objectif Final: La

This is

some



content

Explication:

Plus précisément, je vais avoir des problèmes de travail avec le contenu d'un div, qui se transforme alors en un textarea sur modifier, puis retour à une div lorsque le montage réalisé. La base de données pour stocker les < br > balises sur enregistrer... il semble que les textareas utiliser des retours à la ligne (\n) et retours (\r) au lieu de sorte que la conversion entre ces (< br >, \n et \r) est devenu un peu un problème pour moi.

Est-il une bonne façon de gérer cette entre plusieurs navigateurs? Peut-être il pourrait être plus facile d'utiliser textarea est tout le temps (et d'oublier les divs)? C'est quand j'ai essayer de déplacer le contenu entre un div et un textarea et ensuite revenir à une div, funky, les choses commencent à se produire avec l'espacement.

Plus En Détail Edit:

Si l'utilisateur clique sur modifier, et tourne à l'origine de la div dans un textarea, ils commencent à faire des changements et cliquez sur terminé, mais décide d'annuler la modification et revenir à l'ancien contenu. Le textarea se transforme en un div et l'ancien contenu (stockées dans un div caché) remplace ce que l'utilisateur a écrit. D'où le va et vient de contenu.

Edit:

D'excellents commentaires, merci à tous! Je préfère ne pas utiliser le whtiespace css que ce besoin de travailler sur des sites qui ont déjà été mises au point et nécessiterait des modifications sur tous les divs maintenant le contenu sur chaque page. < br >'doit être enregistré dans la base de données.

Vous avez évoqué le problème ! Le texte de la zone utilise \r saut de ligne. HTML utilise <br>
Avez-vous essayé quelque chose comme .replace(/\n/g, "<br>")?
Vous pouvez utiliser white-space:pre-line; sur la div et ne pas s'inquiéter de les stocker en tant que <br/>. 😉
Voici un exemple de ce que @BradChristie est la description: jsfiddle.net/C8Fnz
"It's when I try to move the content between a div and a textarea and then back to a div" Cette phrase m'avaient laissé penser qu'il était exigence...

OriginalL'auteur Tony M | 2013-08-09

  1. 5

    Cela vous aide?

    function replaceLineBreaksWithHTML(string) {
 return string !== undefined ? string.replace(/\n/g, '<br/>') : "";
}

function replaceHTMLWithLineBreaks(string) {
 return string !== undefined ? string.replace(/<br\/>/gi, '\n') : "";
}
    Cela semble avoir l'effet que je veux, mais ajoute plus de l'espace supplémentaire est nécessaire. Pour une raison quelconque, la plupart de ces réponses ajouter plus d'espace. Presque comme si c'était de doubler sur l'espace blanc.
    Ma solution n'est pas d'ajouter n'importe quel espace, il se peut qu'il y est des espaces blancs, vous n'êtes pas penser à l'avance. Vous pouvez essayer d'appeler .trim() sur les cordes pour supprimer les espaces en début et en fin.

    OriginalL'auteur JSager

  2. 1

    Vous pouvez transmettre le texte entre textarea et div éléments de cette façon:

    (notez que je suis à l'aide de jQuery, mais il n'est pas nécessaire, c'est juste une démo)

    $("#b1").click(function(){
    var text = $("textarea").val().replace(/\n/g, "<br>");
    $("div").html(text);
});

$("#b2").click(function(){
    var text = $("div").html().replace(/<br>/gi, "\n");
    $("textarea").val(text);
});

    DÉMO

    OriginalL'auteur letiagoalves

  3. 0

    Vous pouvez utiliser le remplacer regex pour convertir le br \n 🙂

    $('#mytextarea').val($.trim($('#mydiv').html().replace(/<br>/g, '\n')));

    Juste un coup d'oeil à ce violon: http://jsfiddle.net/N7GkH/

    OriginalL'auteur Robin Leboeuf

  4. 0

    Utilisation parseHTML pour ce travail, étant donné que vous êtes en utilisant jQuery.

    var html = $.parseHTML('This is<br><br> some<br> <br> <br> <br> content');
html.appendTo(body);

    OriginalL'auteur federico-t