Segnaposto textarea HTML5 non visualizzato

Non riesco a capire cosa c’è di sbagliato nel mio markup, ma il segnaposto per l’area di testo non verrà visualizzato. Sembra che possa essere coperto con alcuni spazi vuoti e tabs. Quando ti concentri sull’area di testo e cancelli da dove si posiziona il cursore, allora lascia l’area di testo, quindi appare il segnaposto corretto.

     



$(document).ready(function() { $('#message_form').html5form({ allBrowsers : true, responseDiv : '#response', messages: 'en', messages: 'es', method : 'GET', colorOn :'#d2d2d2', colorOff :'#000' } ); });

Questo è sempre stato un trucco per me e molti altri. In breve, i tag di apertura e chiusura per l’elemento devono essere sulla stessa riga, altrimenti un carattere di nuova riga lo occupa. Il segnaposto non verrà quindi visualizzato poiché l’area di immissione contiene contenuto (un carattere di nuova riga è, tecnicamente, contenuto valido).

Buona:

  

Cattivo:

  

Elimina tutti gli spazi e le interruzioni di riga tra i aprono e chiudono .

  ///Correct one  ///Bad one It's treats as a value so browser won't display the Placeholder value  ///Bad one 

è perché c’è uno spazio da qualche parte. Stavo usando jsfiddle e c’era uno spazio dopo il tag. Dopo aver eliminato lo spazio, ha iniziato a funzionare

Beh, tecnicamente non deve essere sulla stessa linea finché non c’è un carattere tra il finale “>” dal tag di inizio e l’inizio “<" dal tag di chiusura. Devi terminare con …> come nell’esempio seguente:

 

usa invece di lasciare uno spazio tra i tag di apertura e di chiusura come

Tra il tag di apertura e chiusura nel nostro caso il tag textarea non deve essere spazio o carattere di nuova riga o qualsiasi testo (valore).

Se c’è spazio, carattere di nuova riga o qualsiasi testo, è considerato come valore che sovrascrive il segnaposto.

  **PlaceHolder Appears**  **PlaceHolder Doesn't Appear**    

Ho avuto lo stesso problema, usando solo un file .pug (simile a .jade ). Mi resi conto che era anche un problema di spazio , dopo la fine delle parentesi di chiusura. Nel mio esempio, è necessario evidenziare il testo dopo (placeholder="YOUR MESSAGE") per vedere:

PRIMA:

 form.form-horizontal(method='POST') .form-group textarea.form-control(placeholder="YOUR MESSAGE") .form-group button.btn.btn-primary(type='submit') SUBMIT 

DOPO:

 form.form-horizontal(method='POST') .form-group textarea.form-control(placeholder="YOUR MESSAGE") .form-group button.btn.btn-primary(type='submit') SUBMIT