Using a float span as the placeholder message instead change the value of the input
Firstly, make the form input as following style
<label><input type="text" placeholder="email" /></label>
We will add a span after the input, the input will become following
<label><input type="text" placeholder="email" /><span>email</span></label>
Than we need to set a css style to the span to make it float on the input:
label { position: relative; }
label span { position: absolute; left: 0; top: 0; }
If you have set some padding on the label or the input, you should use top and left position to tune the span to show it on the right position
Finally, add the following jQuery script inside your html
$(document).ready(function() {
if($.browser.msie && $.browser.version<=9) {
$("[placeholder]").each(function() {
$placeholder = $(this).attr('placeholder');
$(this).after(''+$placeholder+'');
$(this).focus(function() { $(this).next('span').hide(); });
$(this).blur(function() {
if($(this).val().length>0) {
$(this).next('span').hide();
} else {
$(this).next('span').show();
}
});
});
}
});