html - estilos - textarea javascript

Saltos de línea en el elemento textarea

Question

Esto es PURE HTML. (sin php ni nada de eso, si desea conocer el fondo es una aplicación C # con HTML en una vista web).

Todos mis archivos HTML están muy formateados y correctamente sangrados para su mantenimiento y tal.

Aquí hay un extracto:

<tr>
    <td class="label">Clinic Times:</td>
    <td><textarea name="familyPlanningClinicSessionsClinicTimes">Monday:
    Tuesday:
    Wednesday:
    Thursday:
    Friday:
    Saturday:
    Sunday:</textarea></td>
</tr>

Los saltos de línea en el elemento <textarea></textarea> están ahí para obtener los saltos de línea en la página. Sin embargo, también incluye la sangría en el elemento textarea.

p.ej

La única forma en que puedo pensar para eliminar este problema es eliminar la sangría. No es el fin del mundo, pero ¿hay alguna otra forma de mantener el buen formato? Gracias.

Answer 1

En C # si desea enviar una nueva línea a un área de texto, puede usar Environment.NewLine

Answer 2

No hay una solución HTML pura para su problema. Textareas siempre muestra cualquier espacio en blanco en sus contenidos.

En un mundo perfecto, usted podría aprovechar el white-space de la propiedad CSS; desafortunadamente, tampoco se aplica a textareas.

Answer 3

Nop un área de texto escupirá lo que tenga en realidad.

Podría inyectar el valor de JavaScript, pero eso parece mucho trabajo para algo aislado.

Answer 4

Podría usar el 
 (significa nueva línea en html) pero tal vez no sea un buen formato, como dijiste ...

La única forma en que puedo pensar para eliminar este problema es eliminar la sangría. No es el fin del mundo, pero ¿hay alguna otra forma de mantener el buen formato?

<tr>
  <td class="label">Clinic Times:</td>
  <td><textarea name="familyPlanningClinicSessionsClinicTimes">Monday:&#10;Tuesday:&#10;Wednesday:&#10;Thursday:&#10;Friday:&#10;Saturday:&#10;Sunday:</textarea></td>
</tr>

Answer 5

Pruebe <br/> si es bueno para usted:

Monday:<br/>Tuesday:<br/>...

Answer 6

Puedes usar <div> con el atributo contenteditable :

<div contenteditable="true" style="width: 450px; height: 300px; white-space: pre-line;" name="familyPlanningClinicSessionsClinicTimes">Monday:
                            Tuesday:
                            Wednesday:
                            Thursday:
                            Friday:
                            Saturday:
                            Sunday:</div>

Pero en su caso, creo que la solución de la idea consistirá simplemente en utilizar varios cuadros de texto comunes, uno para cada día:

Monday: <input type="text" name="familyPlanningClinicSessionsClinicTimesMonday" /><br />
Tuesday: <input type="text" name="familyPlanningClinicSessionsClinicTimesTuesday" /><br />
...

Answer 7

Si solo desea una lista de elementos, puede usar <ul> <li>"Monday"</li> <li>"Tuesday"</li> ... </ul>
El uso de <ul><li></li></ul> iniciará una lista preformateada con <ul> comenzando la lista y <li> iniciando cada elemento en la lista. Este método no requiere java o css y sangrará automáticamente.