資訊專欄INFORMATION COLUMN
摘要：表單如果表單內(nèi)沒有按鈕，只有元素，那么這個可以升級為按鈕。輸入框選中高亮，輸入非數(shù)字，改變顏色可設(shè)置，不能設(shè)置而則可以，但不能設(shè)置最大字符數(shù)。
form 表單
如果form表單內(nèi)沒有submit按鈕，只有button元素，那么這個button可以升級為submit按鈕。
form 表單用來向服務(wù)器提交信息，常用屬性
action：提交表單的地址
name：頁面中可能不止一個表單，用name來區(qū)分，PS：id 也可以
method：提交表單的方法，post或get
target：在何處打開action
enctype：
application/x-www-form-urlencoded：在發(fā)送前編碼所有字符(默認)
text/plain：空格轉(zhuǎn)換為 "+" ，但不對特殊字符編碼
multipart/form-data：使用包含文件上傳控件的表單時，必須使用該值
注：post請求和get請求區(qū)別：參考文章：99% 的人都理解錯了 HTTP 中 GET 與 POST 的區(qū)別
post比get安全性高，post通過request body傳遞數(shù)據(jù)，get把參數(shù)包含在 URL 中
post一般用于向服務(wù)器傳送數(shù)據(jù)，get一般用于向服務(wù)器獲取數(shù)據(jù)
get請求頁面可以被收藏，post不可以
get只能進行 URL 編碼，而 post支持多種編碼方式
get在 URL 中傳遞參數(shù)有長度限制，而 post沒有
inputinput 標簽用來接收用戶填寫的信息，配合label使用，它的for屬性可以選中form表單內(nèi)的id屬性或者用label把input包裹起來就不需要用for了
常用屬性
type：常用的值
password：輸入的內(nèi)容自動自動變成小圓點
checkbox：多選，靠name屬性分組，提交到后端的時候被選中的
value是以 "," 分割的一個字符串，通過name屬性獲得
radio：單選，靠name分組
hidden：暫存一些信息
file：文件上傳
accept設(shè)置上傳文件格式
multiple文件多選
submit/button/reset：submit可以提交表單，button不能提交表單，reset清空表單
placeholder：提示性文字，一旦輸入內(nèi)容就消失
disabled：該input被禁用
require：該input必須被填寫
selectselect用來設(shè)置下拉菜單，屬性multiple可設(shè)置多選
option標簽，屬性selected：默認選擇
textarea：多行文本輸入，rows，cols設(shè)置默認行列 表單腳本可以通過document.forms[0]獲得表單
myColor.elements[0]可獲得到表單中的第一個字段，多選框name不同，也可以用name的值查找，如myColor.elements[color1]。
myColor.elements.length取得表單中字段的數(shù)量.
myColor.elements[0].disabled = true禁用表單當(dāng)前字段，true為禁用，false為恢復(fù)使用，可以應(yīng)用在表單提交之后，防止用戶反復(fù)提交表單
myText.addEventListener("click",function(){
if(this.elements[3].type === "submit"){
this.elements[3].disabled = true
}
})
autofocus在表單字段中設(shè)置，當(dāng)瀏覽器加載時自動把焦點移到該字段
focus()、change()、blur()分別是獲得焦點時觸發(fā)，失去焦點并改變value才觸發(fā)，失去焦點時觸發(fā)，其中change()和blur()先后順序并沒有嚴格規(guī)定。
輸入框選中高亮，輸入非數(shù)字，改變顏色
myText.elements[0].addEventListener("focus",function(e){
if(e.target.style.borderColor !== "red"){
e.target.style.borderColor = "yellow"
}
})
myText.elements[0].addEventListener("blur",function(e){
console.log(e.target.value)
if(/[^d]/.test(e.target.value)){
e.target.style.borderColor = "red"
}else{
e.target.style.borderColor = ""
}
})
myText.elements[0].addEventListener("change",function(e){
if(/[^d]/.test(e.target.value)){
e.target.style.borderColor = "blue"
}else{
e.target.style.borderColor = ""
}
})
input可設(shè)置size、maxlength，不能設(shè)置rows、cols；而textarea則可以，但不能設(shè)置最大字符數(shù)。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/96105.html
摘要：處理表格和提交等等重置表單重置表單應(yīng)該使用或當(dāng)用戶單擊重置按鈕重置表單時，會觸發(fā)事件，可以在必要的時候取消重置操作另外也可以通過腳本調(diào)用方法重置表單，在調(diào)用方法重置表單時會觸發(fā)事件。在中，表單中新增加了屬性，自動把焦點移動到相應(yīng)字段。 HTMLFormElement繼承了HTMLElement，它自己獨有的屬性和方法有： acceptCharset:服務(wù)器能夠處理的字符集，等價于HT...
摘要：文本框獲得焦點時，選中其中所有的文本思路利用焦點事件事件，在文本框獲得焦點時，利用其方法選中所有文本。自動切換焦點思路利用事件檢測用戶輸入新字符后，文本框內(nèi)的字符串是否已經(jīng)達到最大長度，若達到最大長度，則將焦點切換至下一個文本框。 JavaScript 表單腳本 通過 document.forms 可以獲得一個包含當(dāng)前頁面中所有表單的集合 HTMLFormElement 接口 下面是這...
摘要：瀏覽器如何將數(shù)據(jù)發(fā)送給服務(wù)器對表單字段的名稱和值進行編碼，使用和號分隔不發(fā)送禁用的表單字段只發(fā)送勾選的復(fù)選框和單選按鈕不發(fā)送為和的按鈕多選框中每個選中的值單獨一個條目在單擊提交按鈕提交表單的情況下，也會發(fā)送提交按鈕。否則不發(fā)送提交按鈕。 瀏覽器如何將數(shù)據(jù)發(fā)送給服務(wù)器： 對表單字段的名稱和值進行URL編碼，使用和號（&）分隔 不發(fā)送禁用的表單字段 只發(fā)送勾選的復(fù)選框和單選按鈕 不發(fā)送t...
閱讀 2322·2021-10-11 10:59
閱讀 1177·2021-09-23 11:21
閱讀 3844·2021-09-06 15:02
閱讀 1764·2021-08-19 10:25
閱讀 3625·2021-07-30 11:59
閱讀 2536·2019-08-30 11:27
閱讀 2715·2019-08-30 11:20
閱讀 3110·2019-08-29 13:15
