jQuery 操作 radio/checkbox/select

本文主要介绍 checkbox、select、radio 等元素在 JQuery 中的常用操作。

radio 常用使用方式：

// 默认选中第一个选项
$("input[name='elementName']").eq(0).prop("checked", true);
// 按值选中某个选项
$("input:radio[name='elementName'][value='valueData']").prop("checked", true);

checkbox 常用使用方法：

//全选/反选
var checked = $("#elementID").prop("checked");
if(checked) {
	$("input[name='elementName']").prop("checked", true);
} else {
	$("input[name='elementName']:checked").prop("checked", false);
}
// 获得选中的数据
$("input[name='elementName']:checked").each(function() {
	var value = $(this).val();
});

select 常用使用方法：

// 获取 option 选中项的文本
$("#elementID option:selected").text();
// 默认选中第一个选项
$("#elementID option:first").prop("selected", true);
// 根据 option 数据选中值
$("#elementID option[value='abc']").attr("selected", true);
// 获取 option 自定义数据
$("#elementID").change(function () {
    //option data-code=""
    $(this).find("option:selected").data("code");
});

jquery 获取 hidden 方法：

// 隐藏域
$("input:hidden[name='name']").val();
// 根据 attr 筛选数据
$("input[name='name'][attr-name='attr-value']").val();