JavaScript - 表單元素 - Input Element

form表單input元素

JavaScript form表單input元素屬性

名稱	說明
form	取得input屬於那一個form
name	name屬性
type	類型
value	設定或取得input的值，除下拉式功能表以外
accessKey	此input的快捷鍵
accept	顯示伺服器支援的ContentType清單
defaultValue	設定或取得input的預設值
disabled	設定input是否有作用，true為沒作用
tabIndex	設定Tab鍵切換順序

JavaScript form表單input元素文字

名稱	說明
maxLength	設定或取得input最大字元數
readOnly	設定或取得input是否是一個唯讀input，true為是
size	設定或取得input的尺寸

disabled與readOnly

• disable會使欄位無效，內容值無法傳送或讀取
• readOnly會使欄位唯讀，但內容可傳送或讀取

JavaScript form表單input元素方法

名稱	說明
blur()	設定input失去處理權
focus()	設定input擁有處理權
select()	選取input，使用反白顯示文字內容，只可以使用在文字欄位
click()	觸發onclick事件，button、checkbox、radio、reset、submit

如果使用input方法選擇文字欄位，需同時使用select()與focus()，欄位內容才會反白與取得處理權，例如，

obj.select();
obj.focus(); 

在button中使用submit()

<input type="button" value="Submit" onclick="document.forms["form1"].submit();" /> 

如果使用submit()方法來提交表單，不會觸發<form>的onsubmit()事件，這點與<input type="submit />或<input type="image" />提交按鈕不同。

防止使用者重覆按下提交按鈕

<input type="button" value="Submit" onclick="this.disabled=true;this.form.submit();" /> 

滑鼠經過時自動選擇文字

• 在滑鼠經過時onmouseover="this.focus()";
• 在取得處理權後，選取文字，onfocus="this.select()";