DOM event for browser password autofill?

Question

I've got a fairly standard username/password entry box on a web site I'm building. The password box has a div containing "Password" overlaid on top of it, which is set to display: none; on focus or click.

This works great until the user asks their browser to remember the password: in that case you can end up with the situation in the attached screen shot.

My question then is: is there an event that I can bind to that will trigger when the password field autofills so I can hide the help div?

Answer 1

Here's the crappy solution I came up:

I added an interval timer to the site that checks the value of the box, and hides the help text when the value is not an empty string.

Answer 2

Why don't you verify if the password textbox is filled on the document.ready event and on each usernametextfield.onchange event? That way you don't need a timer and it should be right.

Note: It could be (I haven't tested this) that the onchange event will be triggered before the browser has filled in the password field. To handle that short timespan, you could launch the check a few 100 milliseconds later using setTimeOut.