jQuery 是一個快速、簡潔的 JavaScript 庫，它簡化了 HTML 文檔遍歷、事件處理、動畫和 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：如何在點擊其他 radio 按鈕時取消選中當(dāng)前選中的 radio 按鈕？

答：可以使用 change() 方法為所有 radio 按鈕添加事件處理程序，當(dāng)點擊其他 radio 按鈕時，取消選中當(dāng)前選中的 radio 按鈕，示例代碼如下：

$("input[name='gender']").change(function() {
  $("input[name='gender']").not(this).prop("checked", false);
});

問題2：如何判斷一個 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？如果不支持，是否可以回退到其他解決方案？

新聞標(biāo)題：jQuery操作input中radio的技巧
分享網(wǎng)址：http://uogjgqi.cn/article/dpsgsgp.html