Hide placeholder value with JQuery

问题

I have a lot of templates with some text input like this:

<input type="text" autocomplete="off" value="" placeholder="Keywords" name="keywords" id="keywords">

The client asked me to hide the placeholder value (Keywords in the example) when the user click on the field. I don't know how to do this with JS and JQuery. Is there a way to make this happen with a crossbrowser solution?

回答1:

Try this: { check it if cross browser }

http://jsfiddle.net/MDhtj/1

$('input[placeholder]').on('focus', function () {
    var $this = $(this);
    $this.data('placeholder', $this.prop('placeholder')).removeAttr('placeholder')
}).on('blur', function () {
    var $this = $(this);
    $this.prop('placeholder', $this.data('placeholder'));
});

来源：https://stackoverflow.com/questions/17008714/hide-placeholder-value-with-jquery