建站
咨詢
售后
建站咨詢
新聞中心
jQuery 是一個(gè)快速、簡(jiǎn)潔的 JavaScript 庫，它簡(jiǎn)化了 HTML 文檔遍歷、事件處理、動(dòng)畫和 Ajax 交互等操作，在網(wǎng)頁開發(fā)中，我們經(jīng)常需要使用 jQuery 來操作 input 中的 radio 按鈕，本文將介紹如何使用 jQuery 操作 input 中的 radio 按鈕的技巧。
1、獲取選中的 radio 按鈕
要獲取選中的 radio 按鈕，我們可以使用 :checked 選擇器，假設(shè)我們有以下 HTML 代碼：
男 女
我們可以使用以下 jQuery 代碼獲取選中的 radio 按鈕：
var selectedGender = $("input[name='gender']:checked").val();
console.log(selectedGender); // 輸出 "male" 或 "female"
2、設(shè)置選中的 radio 按鈕
要設(shè)置選中的 radio 按鈕，我們可以使用 prop() 方法，假設(shè)我們有以下 HTML 代碼：
男 女
我們可以使用以下 jQuery 代碼設(shè)置選中的 radio 按鈕：
$("input[name='gender'][value='male']").prop("checked", true);
3、禁用或啟用 radio 按鈕
要禁用或啟用 radio 按鈕，我們可以使用 prop() 方法，假設(shè)我們有以下 HTML 代碼：
男 女
我們可以使用以下 jQuery 代碼禁用或啟用 radio 按鈕：
// 禁用選中的 radio 按鈕
$("input[name='gender']:checked").prop("disabled", true);
// 啟用選中的 radio 按鈕
$("input[name='gender']:checked").prop("disabled", false);
4、為 radio 按鈕添加事件處理程序
要為 radio 按鈕添加事件處理程序，我們可以使用 change() 方法，假設(shè)我們有以下 HTML 代碼：
男 女
我們可以使用以下 jQuery 代碼為 radio 按鈕添加事件處理程序：
$("submit").click(function() {
var selectedGender = $("input[name='gender']:checked").val();
console.log(selectedGender); // 輸出 "male" 或 "female"
});
以上就是使用 jQuery 操作 input 中的 radio 按鈕的技巧，接下來，我們將回答一些與本文相關(guān)的問題。
問題1：如何在點(diǎn)擊其他 radio 按鈕時(shí)取消選中當(dāng)前選中的 radio 按鈕？
答：可以使用 change() 方法為所有 radio 按鈕添加事件處理程序，當(dāng)點(diǎn)擊其他 radio 按鈕時(shí)，取消選中當(dāng)前選中的 radio 按鈕，示例代碼如下：
$("input[name='gender']").change(function() {
$("input[name='gender']").not(this).prop("checked", false);
});
問題2：如何判斷一個(gè) radio 按鈕是否被禁用？
答：可以使用 prop() 方法獲取 radio 按鈕的 disabled 屬性，如果返回 true，則表示該 radio 按鈕被禁用；如果返回 false，則表示該 radio 按鈕未被禁用，示例代碼如下：
var isDisabled = $("input[name='gender']").prop("disabled");
console.log(isDisabled); // 如果被禁用，輸出 "true"；否則，輸出 "false"
問題3：如何在頁面加載完成后執(zhí)行某些操作？
答：可以使用 $(document).ready() 方法在頁面加載完成后執(zhí)行某些操作，示例代碼如下：
$(document).ready(function() {
// 在這里編寫需要在頁面加載完成后執(zhí)行的操作
});
問題4：如何在瀏覽器支持的情況下使用原生 JavaScript？如果不支持，是否可以回退到其他解決方案？
分享文章：jQuery操作input中radio的技巧
文章出自：http://fisionsoft.com.cn/article/dpsgsgp.html
