JQuery是一種廣泛使用的JavaScript庫,可用于操作HTML DOM、處理事件、使用AJAX等等。其中較常用的功能之一是處理表單元素,比如:RadioButton(單選按鈕)。
RadioButton是一個被廣泛使用的表單元素,一般用于讓用戶從幾個選項中選擇一個。在JQuery中,可以通過“change”事件監聽RadioButton的變化,并對其進行相應的處理。
<script>
$(document).ready(function(){
$('input[type="radio"]').change(function(){
var value = $("input[name='radio']:checked").val();
alert("您選擇的是:" + value);
});
});
</script>
<p>請選擇一個選項:</p>
<form>
<input type="radio" name="radio" value="1">選項一<br>
<input type="radio" name="radio" value="2">選項二<br>
<input type="radio" name="radio" value="3">選項三<br>
</form>
上述代碼中,“$(document).ready(function(){...})”表示文檔加載完畢后會執行相應的操作。“$('input[type="radio"]')”則是選擇了文檔中所有的RadioButton元素。“.change(function(){...})”表示在元素發生變化時會執行對應的函數。
函數中的“var value = $("input[name='radio']:checked").val();”表示選擇了名為“radio”的RadioButton,并獲取其選中項的值。最后通過alert()方法彈出選中項的值。
在這個例子中,您可以選擇任何一個選項,當您的選擇改變時會彈出一個對話框告訴您您的選擇是什么。這個例子可以用于多種情況,例如:在表單提交前驗證數據、動態改變文本框的內容等等。