使用jQuery操作CheckBox與radio

2022-02-18 13:56:09 字數 966 閱讀 9076

頁面寫法, 同乙個選項裡的設定同乙個name

籃球  //使用checked可以在頁面初始化的時候預設選中

足球

羽毛球

點選的時候判斷當前是選中還是取消

$('[name="hobby"]').click(function () )

手動設定取消,選中

// 有兩種方式

$(".hobby:eq(0)").attr('checked', true)

$(".hobby:eq(0)").attr('checked', false)

$(".hobby:eq(1)").prop('checked', true)

$(".hobby:eq(1)").prop('checked', false)

這兩種方式都可以設定,但是有些jquery版本原因,使用attr設定的頁面的選擇樣式不會改變,官網也推薦如果是

radio或者checkbox等設定true和false的屬性使用prop

獲取選擇的值

$("input:checked").each(function

())

小學

初中 // 預設選中

高中

radio 設定相同的name會互斥,實現只能選擇乙個的效果

checked設定預設選中

手動設定取消,選中

方式和checkbox一樣

$(".grade:eq(1)").prop('checked', true) //

選中$(".grade:eq(1)").prop('checked', false) //

取消選中

獲取選擇的值

const value = $(".grade:checked").val()

使用jQuery選中所有同組的checkbox

jquery在頁面獲取checkbox陣列時 使用 var num input checkbox name cbx checked length 即可獲得所有name屬性為 cbx 的checkbox陣列。通過length屬性即可得到陣列長度。取id cbxall 是有講究的,因為id cbxall...

使用jquery操作select

jquery獲取select選擇的text和value 語法解釋 1.select id change function 為select新增事件,當選擇其中一項時觸發 2.var checktext select id find option selected text 獲取select選擇的tex...

使用JQUERY操作Radio

發展中經常使用radio為了實現使用者的選擇的影響。我在該專案中使用的一些jquery操作radio該方法。這裡分享,對於有需要的朋友參考的。1 變化radio選擇。引發一些結果 input radio name dialcheckresult change function 2 讓頁面中全部的ra...