HTML DOM FileUpload 物件

風靈使發表於2018-11-24
HTML物件

FileUpload 物件

在 HTML 文件中 <input type="file"> 標籤每出現一次，一個 FileUpload 物件就會被建立。

該元素包含一個文字輸入欄位，用來輸入檔名，還有一個按鈕，用來開啟檔案選擇對話方塊以便圖形化選擇檔案。

該元素的 value 屬性儲存了使用者指定的檔案的名稱，但是當包含一個 file-upload 元素的表單被提交的時候，瀏覽器會向伺服器傳送選中的檔案的內容而不僅僅是傳送檔名。

為安全起見，file-upload 元素不允許 HTML 作者或 JavaScript 程式設計師指定一個預設的檔名。HTML value 屬性被忽略，並且對於此類元素來說，value 屬性是隻讀的，這意味著只有使用者可以輸入一個檔名。當使用者選擇或編輯一個檔名，file-upload 元素觸發 onchange 事件控制程式碼。

您可以通過遍歷表單的 elements[] 陣列，或者通過使用 document.getElementById()來訪問 FileUpload 物件。

FileUpload 物件的屬性

屬性 描述
accept 設定或返回指示檔案傳輸的 MIME 型別的列表（逗號分隔）。
accessKey 設定或返回訪問 FileUpload 物件的快捷鍵。
alt 設定或返回不支援 <input type="file"> 時顯示的替代文字。
defaultValue 設定或返回 FileUpload 物件的初始值。
disabled 設定或返回是否禁用 FileUpload 物件。
form 返回對包含 FileUpload 物件的表單的引用。
id 設定或返回 FileUpload 物件的 id。
name 設定或返回 FileUpload 物件的名稱。
tabIndex 設定或返回定義 FileUpload 物件的 tab 鍵控制次序的索引號。
type 返回表單元素的型別。對於 FileUpload ，則是 “file” 。
value 返回由使用者輸入設定的文字後，FileUpload 物件的檔名。

標準屬性

屬性 描述
className 設定或返回元素的 class 屬性。
dir 設定或返回文字的方向。
lang 設定或返回元素的語言程式碼。
title 設定或返回元素的 title 屬性。

FileUpload 物件的方法

方法 描述
blur() 從 FileUpload 物件上移開焦點。
focus() 為 FileUpload 物件賦予焦點。
select() 選取 FileUpload 物件。

onchange 事件

定義和用法

onchange 事件會在域的內容改變時發生。

語法

onchange="SomeJavaScriptCode"
引數 描述
SomeJavaScriptCode 必需。規定該事件發生時執行的 JavaScript。

支援該事件的 HTML 標籤：

<input type="text">, <select>, <textarea>

支援該事件的 JavaScript 物件：

fileUpload, select, text, textarea

例項 1

在本例中，我們將在使用者改變輸入域內容時執行 JavaScript 程式碼：

<html>
<head>
<script type="text/javascript">
function upperCase(x)
{
var y=document.getElementById(x).value
document.getElementById(x).value=y.toUpperCase()
}
</script>
</head>

<body>

輸入您的姓名：
<input type="text" id="fname" onchange="upperCase(this.id)" />

</body>
</html>

相關文章