J'utilise un plugin jQuery placeholder (https://github.com/danielstocks/jQuery-Placeholder). Je dois changer le texte de l'espace réservé en fonction de la modification du menu déroulant. Mais il ne change pas. Voici le code :
$(function () {
$('input[placeholder], textarea[placeholder]').placeholder();
$('#serMemdd').change(function () {
var k = $(this).val();
if (k == 1) {
$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder();
}
else if (k == 2) {
$("#serMemtb").attr("placeholder", "Type an ID").placeholder();
}
else if (k == 3) {
$("#serMemtb").attr("placeholder", "Type a Location").placeholder();
}
});
});
Mon Html :
<div class="filterbox">
<select name="ddselect" id="serMemdd">
<option value="1" selected="selected">Search by Name</option>
<option value="2">Search by ID</option>
<option value="3">Search by Location</option>
</select>
<input id="serMemtb" type="text" style="width: 490px" placeholder="Type a name (Lastname, Firstname)" />
<input id="seMemBut" type="button" value="Search" />
</div>
Quelqu'un peut-il résoudre ce problème ?
Le plugin n'a pas l'air très robuste. Si vous appelez .placeholder()
à nouveau, il crée une nouvelle instance de Placeholder
alors que les événements sont toujours liés à l'ancienne.
En regardant le code, il semble que vous pourriez le faire :
$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();
EDIT
placeholder
est un [attribut HTML5] (http://dev.w3.org/html5/spec/Overview.html#the-placeholder-attribute), [devinez qui ne le supporte pas ?] (http://www.quirksmode.org/html5/tests/inputs.html)
Votre plugin ne semble pas vraiment vous aider à surmonter le fait qu'IE ne le prend pas en charge, alors que ma solution fonctionne, votre plugin ne fonctionne pas. Pourquoi ne pas en trouver un qui fonctionne ?
$(this).val()
est une chaîne de caractères. Utilisez parseInt($(this).val(), 10)
ou vérifiez '1' ;. La dizaine désigne la base 10.
$(function () {
$('input[placeholder], textarea[placeholder]').blur();
$('#serMemdd').change(function () {
var k = $(this).val();
if (k == '1') {
$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();
}
else if (k == '2') {
$("#serMemtb").attr("placeholder", "Type an ID").blur();
}
else if (k == '3') {
$("#serMemtb").attr("placeholder", "Type a Location").blur();
}
});
});
$(function () {
$('input[placeholder], textarea[placeholder]').placeholder();
$('#serMemdd').change(function () {
var k = parseInt($(this).val(), 10);
if (k == 1) {
$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();
}
else if (k == 2) {
$("#serMemtb").attr("placeholder", "Type an ID").blur();
}
else if (k == 3) {
$("#serMemtb").attr("placeholder", "Type a Location").blur();
}
});
});
ori a attiré mon attention sur le fait que le plugin que vous utilisez ne résout pas le problème HTML d'IE.
Essayez quelque chose comme ceci : http://archive.plugins.jquery.com/project/input-placeholder
Déplacer votre première ligne vers le bas le fait pour moi :
$(function () {
$('#serMemdd').change(function () {
var k = $(this).val();
if (k == 1) {
$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder();
}
else if (k == 2) {
$("#serMemtb").attr("placeholder", "Type an ID").placeholder();
}
else if (k == 3) {
$("#serMemtb").attr("placeholder", "Type a Location").placeholder();
}
});
$('input[placeholder], textarea[placeholder]').placeholder();
});