2012-04-14 4 views
31

Tengo una cadena que tiene nuevas líneas. Quiero convertirlas a HTML <br> s, pero estoy teniendo dificultades para detectarlas.cadena de JavaScript con nueva línea, pero no la usa n

imaginar una cadena JavaScript establecido así:

var foo = "Bob 
is 
cool"; 

Son el tipo de nuevas líneas que tengo que detectar. No están usando el carácter especial \n, son simplemente formato.

+2

Ese * es * '\ n' (a menos que sea posiblemente también' \ r') –

+0

Creo que quiso decir que no están expresados ​​con la secuencia de escape '\ n', sino que el personaje está literalmente en la fuente código. – Pointy

+1

@Pointy: pero el resultado seguiría siendo el mismo, siempre que no se tratara de un error de sintaxis. – Evert

Respuesta

55

La razón por la que no funciona es porque las cadenas javascript deben terminarse antes del siguiente carácter de nueva línea (no es un \n obviamente). El motivo \n existe es permitir a los desarrolladores una forma fácil de poner el carácter de nueva línea (ASCII: 10) en sus cadenas.

Cuando usted tiene una cadena que se parece a esto:

//Note lack of terminating double quote 
var foo = "Bob 

Su código tendrá un error de sintaxis en ese punto y dejará de funcionar.

Si usted desea tener una cadena que se extiende por varias líneas, es posible insertar un carácter de barra invertida '\' justo antes de terminar la línea, así:

//Perfectly valid code 
var foo = "Bob \ 
is \ 
cool."; 

Sin embargo esa cadena se no contener \n caracteres en las posiciones donde la cuerda se dividió en líneas separadas.La única forma de insertar una línea nueva en una cadena es insertar un carácter con un valor de 10, cuya forma más fácil es el carácter de escape \n.

var foo = "Bob\nis\ncool."; 
+1

Actualización de agosto de 2016: AHORA hay una forma de hacerlo: https://stackoverflow.com/a/40334713/1454514 –

6

Verificar \n o \r o \r\n.

Hay varias representaciones de nuevas líneas, ver http://en.wikipedia.org/wiki/Newline#Representations

+0

Lo estoy haciendo. Revisé los tres: 'console.log (story.message.split (/ \ n/g)); \t \t \t \t \t console.log (story.message.split (/ \ r/g)); \t \t \t \t \t console.log (story.message.split (/ \ r \ n/g)); 'Todos devuelven lo mismo. Sin división –

1

Creo que el uso de todos modos, incluso \n Couse no visible, o tal vez usando \r. Tan solo reemplace \n o \r con <br/>

3

No creo que entienda cómo funciona \ n. La cadena resultante todavía contiene un byte con el valor 10. Esto se representa en el código fuente de JavaScript con \ n.

el fragmento de código que envió en realidad no trabajar, pero si lo hiciera, la nueva línea habría ser equivalente a \ n, a no ser que se trata de una nueva línea de estilo ventanas, en cuyo caso sería \ r \ n. (pero incluso eso el reemplazo todavía funcionaría).

+0

Gracias. En ese caso, ¿por qué no va a funcionar esto? 'console.log (story.message.split (/ \ n/g)); console.log (story.message.split (/ \ r/g)); console.log (story.message.split (/ \ r \ n/g)); 'Todos devuelven lo mismo. No dividir –

+0

Publicar un fragmento de código completo, incluidas las cadenas reales. – Evert

2

puede utilizar la siguiente función:

function nl2br (str, is_xhtml) { 
    var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>'; 
    return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2'); 
    } 

así:

var mystr="line\nanother line\nanother line"; 
mystr=nl2br(mystr); 
alert(mystr); 

esto debe alertar line<br>another line<br>another line

la fuente de la función es a partir de aquí: http://phpjs.org/functions/nl2br:480

esto imita s la función nl2br en php ...

+0

No publique un enlace como respuesta. :) –

+3

estuvo de acuerdo, pegó la función aquí - con cortesía de la fuente. es bastante difícil escribir una secuencia de comandos completa desde el sitio móvil de stackoverflow :) –

0

Este es un pequeño adition al post de @ Andrew Dunn por encima de

La combinación de la 2 es posible generar JS legibles y salida a juego

var foo = "Bob\n\ 
    is\n\ 
    cool.\n\"; 
17

ACTUALIZACIÓN: yo acabamos de a través de un maravilloso diseño de sintaxis en JavaScript-ES6 llamado Template literals. Lo que quiere hacer se puede hacer literalmente usando ` (carácter de acento grave o grave).

var foo = `Bob 
is 
cool`; 

En cuyo caso, foo === "Bob\nis\ncool" es verdadero.

Por qué los diseñadores decidieron que ` ... ` pueden dejarse sin terminar, pero el " ... " y el ' ... ' son ilegales de tener caracteres de nueva línea en ellos me supera.

Solo asegúrese de que el navegador de segmentación sea compatible con la implementación de Javascript especificada por ES6.

 


PS Esta sintaxis tiene una característica muy bien que es similar a PHP y muchos más lenguajes de script, a saber, "Tagged template literals" en la que se puede tener una cadena como esta:

var a = 'Hello', b = 'World'; 
console.log(`The computer says ${ a.toUpperCase() }, ${b}!`); 
// Prints "The computer says HELLO, World!" 
+0

Encontré una respuesta más completa aquí : https://stackoverflow.com/a/805113/1454514 –

Cuestiones relacionadas