JQuery 各種操作表單元素方法小結

2022-02-18 05:52:46 字數 2708 閱讀 4771

jquery操作表單總結:

1、文字框、密碼框、隱藏域、文字域(id換成對應的,value屬性存在,才能利用attr(『value』) 獲取值,否則返回undefined):

1.1 獲取—>$(「#text」).val()或者$(「#text」).attr(『value』)

1.2 設定—>$(「#text」).val(『test』)或者$(「#text」).attr(『value』,』test』)

2、按鈕:普通按鈕、重置按鈕和提交按鈕(id換成對應的,value屬性存在,才能利用attr(『value』) 或者val()獲取值,否則attr返回undefined,val返回空)

2.1 獲取—>$(「#btn」).val()或者$(「#btn」).attr(『value』)

2.2 設定—>$(「#btn」).val(『test』)或者$(「#btn」).attr(『value』,』test』)

3、核取方塊、單選框:(id換成對應的,value屬性存在,才能利用attr(『value』) 或者val()獲取值,否則attr返回undefined,val返回on(不管是否存在checked屬性))

3.1 獲取—>$(「#check」).val()或者$(「#check」).attr(『value』)

3.1 設定—>$(「#check」).val(『test』)或者$(「#check」).attr(『value』,』test』)

3.3 獲取選中的核取方塊的值:$(「input[type=checkbox][checked]「).attr(『value』)或者$(「input[type=checkbox][checked]「).val()【ps:只會返回第乙個被選中的值】

//獲取全部選中的核取方塊的值

$(「input[type=checkbox][checked]「).each(function())

//若要將全選中的值傳遞給後台,則將核取方塊的name屬性命名為namevalue形式

3.4 全選、取消全選和反選(單選框不能全選,可以反選)

$(「[name='test1']「).attr(「checked」,『checked』);

//取消全選

$(「[name='test1']「).removeattr(「checked」)//反選

$(「[name='test1']「).each(function()

else

});3.5 判斷選中狀態:$(「#test1″).attr(「checked」) :未選中返回undefined,選中返回checked。所以,$(「#test1″).attr(「checked」) == true不能作為是否選中的判斷,$(「#test1″).attr(「checked」) == undefined可以作為未選中的判斷。

3.6取消

選擇—>$(「#test1″).attr(「checked」,false)或者$(「#test1″).removeattr(「checked」)(ps:$(「#test1″).attr(「checked」,」」)在firefox中有效,在google中無效)

3.7 選中某個核取方塊(單選框)–>$(「#test2″).attr(「checked」,true)或者$(「#test2″).attr(「checked」,」checked」)

4、下拉框:

4.1 獲取選中選項的值—>$(「#slt」).val()(ps:$(「#slt」).attr(『value』)會返回undefined)

4.2 設定—>$(「#slt」).val(『audi』)(ps:如果select中有值為audi的選項,該選項就會被選中,如果不存在,則select不做任何變動)

4.3 獲取選中選項的文字—>$(「#slt option:selected」).text()或者$(「#slt」).find(「option:selected」).text()

4.4 設定選中選項的文字—>$(「#slt」).find(「option:selected」).text(『test』)或者$(「#slt option:selected」).text(『test』);

4.5 獲取選中項的索引—>$(「#slt」).get(0).selectedindex

4.6 設定索引—>$(「#slt」).get(0).selectedindex = index(ps:索引從0開始,index的最大值不能超過option的最大索引,否則$(「#slt」).get(0).selectedindex 返回-1)

4.7 清空select—>$(「#slt」).html(」) 或者$(「#slt」).empty()

4.9 刪除option—>$(「#slt option[value='opel']「).remove():刪除值是opel的option(value屬性要存在,同樣可以根據存在的text/index屬性刪除option)

5、元素的可用性(disabled的官方值是disabled)

5.1 禁用元素—>$(「#text」).attr(「disabled」,true)或者$(「#text」).attr(「disabled」,」disabled」);

5.2 啟用元素—>$(「#text」).attr(「disabled」,false) 或者$(「#text」).removeattr(「disabled」);

5.3 是否可用—>$(「#text」).attr(「disabled」) 返回disabled則不可用,返回undefined則可用(ps:可以根據$(「#text」).attr(「disabled」) ==undefined的返回值判斷)

jQuery選取表單元素

表單元素選擇器 選擇器 說明 button 元素和type屬性值為button的元素。checkbox type屬性值為checkbox的元素。使用 type checkbox 能獲得更高的效能。checked 選中的單選按鈕和核取方塊元素。disabled 所有被禁用的元素。enabled 所有被...

jQuery對from表單元素的操作

最近接觸jquery比較多。其對form的操作跟js還是一定區別的。總之jquery功能強大,值得一學。取得下拉列表的選取值 testselect option selected text 或 testselect find option selected text 或 testselect val...

jQuery 處理元素內容 表單元素

處理元素內容 1 text方法 使用說明 1 不傳引數 得到jquery物件內所有元素及其後代元素的文字內容 2 傳入用於設定匹配元素的文字內容 3 傳入function 使用函式來設定jquery物件中每個元素的文字 兩個引數 第乙個表示當前元素序號,第二個引數表示當前元素的文字 函式內部this...