HTML Password Input With Prompt

Question

I wish to have an input field with the prompt inside the field to save presentation space.

Is it possible to have a cross browser password input field on a form that has a text prompt such as Password: * as you start typing it either masks the password or is a true password field.

If you post the form, capture the response which is immediately stored as a password, therefore not text and as a value is submitted no prompt, but should you clear the box, the prompt Password: * re appears.

possible duplicate of [Showing Placeholder text for password field in IE](http://stackoverflow.com/questions/6052544/showing-placeholder-text-for-password-field-in-ie) — winner_joiner, Jul 09 '13 at 10:42
In this [SO-Post](http://stackoverflow.com/questions/6052544/showing-placeholder-text-for-password-field-in-ie) there are many answers and one jsfiddle example that might help [here](http://jsfiddle.net/mNchn/) from the Answer of Kei. — winner_joiner, Jul 09 '13 at 10:45
Just use `` (together with a polyfill for IE if you need it) — Bergi, Jul 09 '13 at 13:19
Problem Solved :You can do the trick follow this URL http://stackoverflow.com/questions/30028615/browser-rember-me-password-prompt-disable/34615586#34615586 — Mukesh, Jan 05 '16 at 15:58

Karl Anderson · Answer 1 · 2013-07-08T19:29:13.360

3

HTML5 has the placeholder attribute, which you can apply to an input element, like this:

<input type="password" placeholder="Enter your password here..." />

If you need to support placeholder-like capability in pre-HTML5 browsers, then check out Cross-Browser Support For HTML5 Placeholder Text In Forms

edited Jul 08 '13 at 19:29

answered Jul 08 '13 at 19:18

Karl Anderson

34,606
12
65
80

Thank you but the answer needs to be a true cross browser solution, not just HTML5. – iggyweb Jul 09 '13 at 07:23

score 1 · Answer 2 · answered Jul 08 '13 at 19:19

1

<input type="password" placeholder="password goes here" />

http://jsfiddle.net/qwGd6/

http://www.w3schools.com/tags/att_input_placeholder.asp

Note that this is not supported in IE9 and below. Go figure.

answered Jul 08 '13 at 19:19

Samuel Reid

1,756
12
22

score 1 · Accepted Answer · edited May 23 '17 at 12:31

1

It sounds like you are looking to watermark the input field. If you are using jQuery, you can use the watermark plugin. This particular plugin works for password marked inputs.

Or you can also use HTML 5's Placeholder as seen here on stackoverflow.

edited May 23 '17 at 12:31

Community

1
1

answered Jul 08 '13 at 19:21

ClosedEyesSeeing

337
2
6

Thank you, that led me to http://mathiasbynens.be/demo/placeholder which seems to work across all browser I have tried :-) – iggyweb Jul 09 '13 at 10:44

HTML Password Input With Prompt

3 Answers3