Jak dodać atrybut zastępczy, jeśli pole "wartość" jest puste

Question

Czy istnieje sposób dodania symbolu zastępczego (znacznika zastępczego, a nie "wartości domyślnej" i podobnych podejść), jeśli istnieje pole wprowadzania tekstu z właściwością "wartość" pusty?

Widziałem wiele podobnych pytań tutaj, ale większość z nich używa wartości domyślnej. Potrzebuję tagów zastępczych i dodatkowo nie mogę w ogóle wpływać na wynik HTML.

To podanym przykładzie wyjście HTML:

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

Answer 1

bym sugerował jeden z następujących sposobów:

$('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().

Albo można użyć tablicę do przechowywania różnych zastępcze:

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

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

JS Fiddle demo.

Aby określić konkretny zastępczy dla danego elementu:

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.

Dodany haczyk/fall-back w przypadku, gdy wpis nie istnieje w zastępczych obiektów dla danego 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

Jeśli używasz HTML5 (i należy) jest rodowitym atrybut zastępczy.

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

Edit

Jak mówiłeś, że nie można edytować kod HTML i trzeba użyć JS, może to pomóc.

$ ('# edit-textbox'). Attr ('symbol zastępczy', 'Mój symbol zastępczy!');

Po raz kolejny, to jest dla HTML 5.

Answer 3

(function($) { 

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

})(jQuery);