jquery如何獲取、設定核取方塊單選框的值

2019-12-12 22:58:53

核取方塊checkbox，單選框radio使用jquery常用的val()或者attr()函數獲取設定選中值，通常都不能達到預期的效果，所以，對於這類勾選的狀態，應該使用prop()方法。

本文就為您介紹核取方塊checkbox，單選框radio的取值、設定選中等操作

1

建立如下結構的測試頁面

-- Content

-- jquery-1.11.3.min.js

-- JqueryProp.html

2

獲取一個核取方塊的選中值，程式碼與瀏覽器執行頁面如圖所示

關鍵取值程式碼，使用prop("checked")判斷哪個選中：

var selected = "";

$(".chk").each(function () {

var $this = $(this);

if ($this.prop("checked") == true) {

selected += $this.val();

}

});

3

獲取多個核取方塊的值，程式碼與瀏覽器執行頁面如圖所示

關鍵取值程式碼，使用prop("checked")判斷那些選中，然後取值連線

4

設定一個核取方塊選中，程式碼與瀏覽器執行頁面如圖所示

關鍵設定值程式碼：指定value值的jquery物件.prop("checked", true)

5

獲取選中的單選框值，程式碼與瀏覽器執行頁面如圖所示

關鍵取值程式碼，使用prop("checked")判斷哪個選中：

var selected = "";

$(".comRadio").each(function () {

var $this = $(this);

if ($this.prop("checked") == true) {

selected += $this.val();

}

});

6

設定單選框選中，程式碼與瀏覽器執行頁面如圖所示

關鍵設定值程式碼：指定value值的jquery物件.prop("checked", true)

7

綜上：

1）核取方塊：可以選擇多個值，所以不能使用.val()方法，而要使用prop("checked")判斷那些選中，然後再使用.val()獲取值

2）單選框：如果使用class選擇器，找到的也不唯一，所以，也不能直接使用.val()方法，而要使用prop("checked")判斷那個選中，然後再使用.val()獲取值

jquery如何獲取、設定核取方塊 單選框的值

1

2

3

4

5

6

7

熱門文章

jquery如何獲取、設定核取方塊單選框的值