Jquery如何操作多選框？

Html程式碼裡多選框控制元件，在生成後多數情況都是給使用者點選選擇的，但有時候程式也需要操作這些控制元件。下面一起來看下用JQuery怎麼操作。

操作方法

（01）首先看下我們的Html程式碼，就是一組Checkbox多選框，和一組操作的按鈕。程式碼裡記得先引入Jquery外掛指令碼。

（02）看下現在頁面的顯示效果，就是一組很標準的多選框和按鈕。

（03）我們先新增第一個按鈕的邏輯。用Jquery選中一個多選框，我們用id選擇器選中這個多選框，然後呼叫prop方法，設定它的屬性 checked為 true就行了。$("#cbSRF")("checked", true);

（04）重新整理執行頁面，我們點選第一個按鈕，如圖，程式自動把第二個多選框選中了。

（05）接著寫第二個按鈕的邏輯，所有的多選框都選中，我們用class選擇器選中所有的多選框，然後還是呼叫prop方法，設定它的屬性 checked為 true。因為所有的多選框都有樣式為 cb的Class，所以$("")就是選擇了所有的選擇框。$("")("checked", true);

（06）再次重新整理頁面，點選第二個按鈕，所有的多選框都呈選中狀態了。

（07）接著寫第三個按鈕的邏輯，獲取選中的多選框的值。這次我們的選擇器是$(":checked")， 即class為 cb, 且是選中狀態的多選框（:checked），沒有選中的排除。然後迴圈這些選中的項，用val()方法取得它的值，放到字串，最後彈框輸出。

（08）重新整理頁面後，我們先選中第一項和第二項，然後點選第三個按鈕。得到正確結果，如圖

（09）第四個按鈕的邏輯，設定一個多選框為不可用狀態，在這個狀態下，使用者不能點選選中它。我們用id選擇器選中這個選項，然後用prop方法，設定 disabled屬性為true就行了。

（10）重新整理頁面，點選第四個按鈕，可以看到最後一個選項的選框顏色變灰了，用滑鼠去點選，也是不能選中的。