HTML and CSS Reference
In-Depth Information
Autocomplete
A fairly simple but important form attribute is autocomplete . It has two states, on and
off , and it defaults to on . Basically, if you do not want autocomplete, just set it to off .
Otherwise, it's the default state of forms. Sometimes autocomplete can be a bother; if so, just
add the following line:
< form autocomplete= ”off” >
With the state set to of , a reused word will not pop up. For example, if you change your
e-mail address, your old address may show up automatically in e-mail address boxes if the
autocomplete is not set to off .
Name and target
h e name attribute is one of the most important attributes of a form because it's used in the
DOM to identify it. As a property of the document object, it can be referenced either as an
array element, such as forms[0] , or by name. Organizationally, it's far easier to reference a
form and its children by a name.
In addition to a name attribute, forms have a global attribute, id . Both attributes have names.
In the DOM, the reference is to the name attribute. However, within a single Web document
(page), other elements can identify the form with a reference to the form id . What's more, a
new feature of HTML5 is that the form child can exist outside the <form> container and
have a form attribute linking it to any form in the page. For example, the following text input
element is part of the form with the id of ralph .
288
< input type = text form=ralph name =hometown>
h e text input element can be anywhere on the page, and that means designers don't have to
put all the input in one place. Try the following script ( FormID.html in this chapter's folder
at www.wiley.com/go/smashinghtml5 ) and test it with Opera (which has implemented
this new feature).
<! DOCTYPE HTML >
< html >
< head >
< script type = ”text/javascript” >
FormMaster=new Object();
FormMaster.resolveForm=function()
{
favorite = document.formName.favURL.value;
personName=document.formName.person.value;
message=personName + “'s favorite Web site is “ +favorite;
document.formName.output.value=message;
}
</ script >
< style type = ”text/css” >
 
Search WWH ::




Custom Search