The JavaScript FileReader object allows web pages to read the contents of files stored on the user's
computer. Files stored on the user's computer may be selected from a FileList object returned as a
result of the user selecting files using the input element:
Files may also be selected with a drag and drop operation. The <img id="output"> element
allows the FileReader to accept files via drag-n-drop and displays the selected file name.
<script>
function loadFile(event)
{
var input = event.target;
var reader = new FileReader();
reader.onload = function()
{
var text = reader.result;
document.getElementById("showFile").innerText = reader.result;
}
reader.readAsText(input.files[0]);
}
</script>
<div id="showFile" style="width:300px; height:200px; margin:8px; border-style:solid;"></div>
<input type="file" accept="text/plain" onchange="loadFile(event)"><img id="output">
The .readAsText() method reads the contents of the specified file. When finished, the
result attribute contains the contents of the file as a text string. You need to provide
an onload callback function that specifies what should happen when the file read is complete.
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
