browser auto fill event

Question

I am doing some website where I have a login form. I know people can save their usernames and passwords on these in their web browsers.

I need to show / hide a label (<label></label>). if the field is empty then the label has to appear, if there is any value in the field then the label has to hide, but this doesn't work with the browser autocomplete, is there anyway I can track this?

I tried with:

jQuery.change();

but that doesn't work.

Is there anything I can do about this rather than turning autocomplete off?

Answer 1

The norm here is to use the placeholder attribute on the relevant input element:

<input type="text" placeholder="username">

username will be displayed within the input when there's no text, and hidden otherwise. If you're using this, then you should probably also use something like Modernizr to detect support and create a normal text label otherwise.