HTML5, JavaScript, and jQuery 24-Hour Trainer

Lesson 34

Files

Files and file systems have always been one of the most important concepts in computing because they provide a convenient mechanism for providing input to, and storing output from, computer software.

Despite this, browsers have been extremely limited in the manner they can interact with files or the file system. This interaction has been limited to the file input type, which can be declared as follows:

<input type="file" name="selectedFile"/>

This creates an input type that allows a file to be selected from the file system. For instance, in Chrome, the input field appears as you see in Figure 34.2, while in Firefox, the input type appears as you see in Figure 34.1.

Figure 34.1

Figure 34.2

Once a file is selected, its content will be submitted to the web server when the form is submitted: The file contents can then be accessed by the web server and processed.

Note

Some modern devices do not support the file input type because they do not expose a file system that allows files to be selected. For instance, this input type is not supported on either the iPad or iPhone.

Despite its simplicity, the file input type is extremely important to HTML, and many of the most popular sites on the Internet could not exist without it. Any time you select a file from ...