Come aggiungere un attributo segnaposto se il campo "valore" è vuoto

Question

C'è un modo per aggiungere un attributo segnaposto (tag segnaposto, non "valore predefinito" e approcci simili) se si dispone di un campo di immissione testo con proprietà "valore" vuoto?

Ho visto molte domande simili qui, ma la maggior parte di esse usa valore predefinito. Ho bisogno di tag segnaposto e inoltre non posso influenzare affatto l'output HTML.

Questo è l'esempio dato output HTML:

<input type="text" value="" name="textbox" id="edit-textbox"> 

Answer 1

io suggerirei di uno qualsiasi dei seguenti approcci:

$('input:text').each(
    function(i,el) { 
     if (!el.value || el.value == '') { 
      el.placeholder = 'placeholdertext'; 
      /* or: 
      el.placeholder = $('label[for=' + el.id + ']').text(); 
      */ 
     } 
    }); 

JS Fiddle demo using el.placeholder = 'placeholdertext'.

JS Fiddle demo using el.placeholder = $('label[for=' + el.id + ']').text().

Oppure si potrebbe usare un array per memorizzare i vari segnaposti:

var placeholders = ['Email address', 'favourite color']; 

$('input:text').each(
    function(i,el) { 
     if (!el.value || el.value == '') { 
      el.placeholder = placeholders[i]; 
     } 
    });​ 

JS Fiddle demo.

Per specificare un particolare segnaposto per un elemento particolare:

var placeholders = { 
    'one' : 'Email address', 
    'two' : 'Favourite color' 
}; 

$('input:text').each(
    function(i,el) { 
     if (!el.value || el.value == '') { 
      el.placeholder = placeholders[el.id]; 
     } 
    });​ 

JS Fiddle demo.

Aggiunto un catch/ripiego nel caso in cui una voce non esiste nei i segnaposto oggetto per un particolare input:

var placeholders = { 
    'oe' : 'Email address', // <-- deliberate typo over there 
    'two' : 'Favourite color' 
}; 

$('input:text').each(
    function(i,el) { 
     if (!el.value || el.value == '') { 
      el.placeholder = placeholders[el.id] || ''; 
     } 
    });​ 

JS Fiddle demo.

Answer 2

Se stai usando HTML5 (e si dovrebbe) c'è un attributo nativo segnaposto.

<input type="text" value="" placeholder="My placeholder!" name="textbox" id="edit-textbox"> 

Modifica

Come hai detto che non è possibile modificare il codice HTML e devono usare JS, questo può aiutare.

$ ('# edit-textbox'). Attr ('segnaposto', 'Il mio segnaposto!');

Ancora una volta, questo è per HTML 5.

Answer 3

(function($) { 

    $('#edit-textbox').attr('placeholder','Your placeholder text'); 

})(jQuery);