jquery对单选框,多选框,文本框等常见操作小结

在jQuery中，对单选框（radio button）、多选框（checkbox）和文本框（text input）的常见操作主要包括选择（selection）、获取值（getting values）、设置值（setting values）、启用/禁用（enabling/disabling）以及触发事件（triggering events）。以下是对这些操作的小结：

### 单选框（Radio Button）

#### 选择

// 选择所有单选框
$('input[type=radio]')

// 选择特定name属性的单选框组
$('input[type=radio][name="groupName"]')

// 选择被选中的单选框
$('input[type=radio][name="groupName"]:checked')

#### 获取值

// 获取被选中的单选框的值
var selectedValue = $('input[type=radio][name="groupName"]:checked').val();

#### 设置值

单选框通常不直接“设置值”，而是通过用户交互来选择。但你可以设置哪个是默认选中的：

// 设置默认选中的单选框
$('input[type=radio][name="groupName"][value="特定值"]').prop('checked', true);

#### 启用/禁用

// 禁用所有单选框
$('input[type=radio]').prop('disabled', true);

// 启用所有单选框
$('input[type=radio]').prop('disabled', false);

### 多选框（Checkbox）

#### 选择

// 选择所有多选框
$('input[type=checkbox]')

// 选择特定name属性的多选框
$('input[type=checkbox][name="groupName"]')

// 选择被选中的多选框
$('input[type=checkbox][name="groupName"]:checked')

#### 获取值

// 获取被选中的多选框的值数组
var selectedValues = $('input[type=checkbox][name="groupName"]:checked').map(function() {
    return this.value;
}).get();

#### 设置值

// 批量设置多选框的选中状态
$('input[type=checkbox][name="groupName"]').each(function() {
    // 假设有一个数组包含需要选中的值
    var valuesToCheck = ["value1", "value2"];
    if ($.inArray($(this).val(), valuesToCheck) !== -1) {
        $(this).prop('checked', true);
    } else {
        $(this).prop('checked', false);
    }
});

// 单个设置
$('input[type=checkbox][name="groupName"][value="特定值"]').prop('checked', true);

#### 启用/禁用

与单选框相同。

### 文本框（Text Input）

#### 选择

// 选择所有文本框
$('input[type=text]')

// 选择特定id或class的文本框
$('#textId')
$('.textClass')

#### 获取值

// 获取文本框的值
var textValue = $('#textId').val();

#### 设置值

// 设置文本框的值
$('#textId').val('新值');

#### 启用/禁用

// 禁用文本框
$('#textId').prop('disabled', true);

// 启用文本框
$('#textId').prop('disabled', false);

这些是jQuery中针对单选框、多选框和文本框的一些常见操作。通过这些操作，你可以轻松地实现用户界面的交互逻辑。