Modification dynamique de l'attribut "espace réservé" des éléments d'entrée HTML5 à l'aide de Javascript

Question

J'essaie de mettre à jour dynamiquement l'attribut HTML5 placeholder d'un champ de texte à l'aide de jQuery.

$("textarea").attr("placeholder", "New placeholder text"); 

De Firebug, je peux observer que l'attribut placeholder est en effet en train de changer. Mais dans l'élément textarea rendu, il reste le même. Aucune suggestion?

Answer 1

Si vous utilisez Firebug, je peux supposer que vous utilisez Firefox, et Firefox ne prend pas encore en charge l'attribut placeholder dans les champs de saisie lui-même.

Placeholder feature detection

Je viens d'essayer sur Chrome pour Mac et il prend en charge le texte de l'espace réservé sur textareas (et des modifications via javascript)

2015 Mise à jour: parfois je gagne la réputation de cette réponse, je tiens à préciser que Cela a été accepté comme étant correct car Firefox 3.6 ne prenait pas en charge l'attribut d'espace réservé. La version 4 a ensuite ajouté le support ("fixé le problème" n'aurait pas été juste) donc le code d'OP fonctionne comme prévu depuis lors.

Answer 2

essayez ceci:

$('#inputTextID').attr("placeholder","placeholder text"); 

Answer 3

Je pense que vous devez faire:

$("textarea").val(''); 
$("textarea").attr("placeholder", "New placeholder text"); 

Answer 4

<label for="myname">Name *</label> 
<input type="text" name="myname" id="myname" title="Please enter your name" 
     pattern="[A-Za-z ]+, [A-Za-z ]+" 
     autofocus required placeholder="Last, First" /> 

Ensuite, vous voulez sélectionner l'espace réservé et remplacer ce texte par le new text that you want to enter.

$("input[placeholder]").attr("placeholder", "This is new text"); 

Cela remplacera le texte de Last, First à This is new text.

Answer 5

travail exemple d'espace réservé dynamique en utilisant Javascript et JQuery http://jsfiddle.net/ogk2L14n/1/

<input type="text" id="textbox"> 
<select id="selection" onchange="changeplh()"> 
    <option>one</option> 
    <option>two</option> 
    <option>three</option> 
    </select> 

function changeplh(){ 
    debugger; 
var sel = document.getElementById("selection"); 
    var textbx = document.getElementById("textbox"); 
    var indexe = sel.selectedIndex; 

    if(indexe == 0) { 
    $("#textbox").attr("placeholder", "age"); 

} 
     if(indexe == 1) { 
    $("#textbox").attr("placeholder", "name"); 
} 
} 

Answer 6

HTML:

<input type="text" placeholder="entername" id="fname"/> 

JS:

$("#fname").attr("placeholder", "New placeholder text");