jquery radio 取值
发布时间:2023-06-16 16:47:00
发布人:zyh
要使用jQuery获取单选按钮(radio button)的值,你可以使用选择器选择所选单选按钮,并使用`.val()`方法获取其值。
以下是一个示例代码,演示如何使用jQuery获取单选按钮的值:
<!DOCTYPE html>
<html>
<head>
<title>jQuery获取单选按钮的值示例</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<input type="radio" name="gender" value="male" id="maleRadio">
<label for="maleRadio">Male</label>
<br>
<input type="radio" name="gender" value="female" id="femaleRadio">
<label for="femaleRadio">Female</label>
<br>
<button id="getValueButton">Get Value</button>
<script>
$(document).ready(function() {
$('#getValueButton').click(function() {
// 获取选中的单选按钮的值
var selectedValue = $('input[name="gender"]:checked').val();
// 在控制台打印值
console.log("选中的值:" + selectedValue);
});
});
</script>
</body>
</html>
在上述示例中,我们有两个单选按钮,其name属性都设置为"gender"。每个单选按钮都有一个value属性用于标识其值。我们还有一个按钮用于触发获取选中单选按钮值的操作。
当点击"Get Value"按钮时,我们使用`$('input[name="gender"]:checked')`选择器选择被选中的单选按钮。然后,使用`.val()`方法获取其值,并将其存储在变量`selectedValue`中。
最后,我们在控制台中打印选中的值,以便进行验证和进一步处理。
请确保在页面加载完成后执行上述代码,这可以通过将其放置在`$(document).ready()`函数中来实现。