In other web browsers they can be used in combination with the .Obviously neither example is very limiting, but it will prevent people from entering completely wrong values, such as phone number, strings with multiple '@'s or spaces.In HTML 3.2, validating data is a difficult process.Each time you get a request, you need to write code to check the input and write any errors the user has made back to the page to help the user to correctly fill in the form.For the browser-impaired, this is how the required input field will appear in Safari with either the image or the elements, but won't work for checkboxes, select elements, etc. For those you might want to place the valid/invalid markers alongside the element or format the input elements themselves using borders, background colours, etc. As soon as a single character has been entered this changes to a green marker to indicate that the input is 'valid'.
Different browsers may mark the input box in some way (Firefox 4 Beta adds a red box-shadow by default), display a warning (Opera) or even prevent the form from being submitted if this field has no value.There's no need to copy any images and, especially if your style-sheets are gzip-compressed, there will be next to no impact on load times. The main problem is that if the user doesn't enter a new value, the placeholder text will be submitted along with the form.In a few minutes you could have your whole website updated. I would highly recommend using one the various placeholder polyfill scripts if you want to support the placeholder attribute in older browsers: e.g.While it would be great to see something like this in every browser, for now you probably need to stick with the ubiquitous Java Script plugins. Arjen, You're correct: and it's not just the plus sign ( ), although I have to admit, I've never seen that used in an email address before.While the code we're using is slightly more complicated, this should get you started: Some of the articles below, particularly the first two, provide other style/scripting options and solutions for supporting older browsers. Wikipedia has a list of potentially valid email formats here: en.wikipedia.org/wiki/Email_address#Valid_email_addresses Most browsers accept [email protected] as valid for email input as it can be technically correct in some situations - on an intranet for example. How do you only show the fields as 'invalid' after the user leaves (blurs? It's ugly to have ready icons displayed when the page loads.Before you ask, and someone always does, these examples will currently work in the following browsers: Safari 5, Chrome 6, Opera 9, Firefox 4 Beta and the i Phone/i Pad.