jquery 多选
jQuery 多选实现方法
jQuery 提供了多种方式实现多选功能，包括复选框操作、下拉多选框以及自定义 UI 组件。以下是几种常见实现方式：
复选框多选
通过 jQuery 选择器获取所有选中的复选框值：
var selectedValues = [];
$('input[type="checkbox"]:checked').each(function() {
selectedValues.push($(this).val());
});Select2 多选下拉框
使用 Select2 插件增强原生 <select multiple>：
<select id="multiSelect" multiple>
<option value="1">选项1</option>
<option value="2">选项2</option>
</select>
<script>
$('#multiSelect').select2();
</script>jQuery UI 多选组件
通过 jQuery UI 实现可交互的多选列表：
<div id="multiSelect">
<div class="option" data-value="1">选项1</div>
<div class="option" data-value="2">选项2</div>
</div>
<script>
$('#multiSelect .option').click(function() {
$(this).toggleClass('selected');
});
</script>获取多选值
对于表单提交，可通过序列化方式获取多选值：
$('form').submit(function() {
var formData = $(this).serialize();
// 处理包含多选值的formData
});注意事项
- 复选框需设置相同的
name属性才能作为数组提交 - 使用插件时注意初始化配置选项
- 移动端需考虑触摸交互体验
以上方法可根据具体需求选择使用原生 jQuery 或配合插件实现。对于复杂场景，推荐使用 Select2 或 jQuery UI 等成熟解决方案。
