HTML and CSS Reference
In-Depth Information
if (!isSupported && el.setAttribute) {
el.setAttribute(eventName, 'return;');
isSupported = typeof el[eventName] == 'function';
}
if (isSupported) {
window.alert('oninvalid supported');
}
The previous code tries two different approaches. First it looks to see if
the oninvalid event exists in the element properties. If that fails, it tries
to set the event on the element and, similar to the earlier input type
detection, looks to see if the type of the attribute is a function.
You don't have to write all this detection code yourself—there's
already a library that will do the work for you. Check out the
Modernizr library at www.modernizr.com. If you don't fancy writing
any of your own form validation code, you can try a different library
that enables HTML5 forms support in all browsers: html5 now.
The html5-now library
Html5-now is an open source project started by Dean Edwards. Dean
is famous for writing several drop-in scripts for old versions of Internet
Explorer, which made them behave in a standards-compliant manner.
The aim of html5-now.js is to provide a drop-in solution that patches
the browser's holes in HTML5 support. It's currently in alpha, but it
already provides a lot of support for HTML5 form controls. Download
it from http://code.google.com/p/html5-now/ , and then include it in
your page like this:
<script src="html5-now/html5-now.js"></script>
The result of adding the script to a form can be seen in the screenshots
that follow. On the left is a screenshot of our HTML5 form in Firefox
3.6; all the HTML5 controls render as text. On the right, after html5-
now.js is added, the number and date controls work.
Search WWH ::




Custom Search