本文介绍如何使用 jquery 实现两个下拉框的动态联动逻辑——当用户在第一个下拉框中选择某项时，自动禁用第二个下拉框中值相同的选项，防止重复选择。
在表单设计中，常需避免用户在多个关联下拉框中重复选择同一数据（例如“负责人”与“协作者”不能为同一人）。借助 jQuery 的事件监听与 DOM 操作能力，可轻松实现这一交互逻辑。
核心思路是：监听所有
以下为完整、健壮的实现代码：
✅ 关键优化说明：
- 使用 $('select.form-control') 精准限定作用范围，避免影响页面其他下拉框；
- 添加空值（""）判断，防止未选择时误禁全部选项；
- 初始调用 .change() 确保页面加载后状态即生效（如服务端已预设默认值）；
- filter() + prop('disabled', true) 组合语义清晰、性能良好，兼容主流浏览器。
⚠️ 注意事项：
- 若下拉框选项由 AJAX 动态加载，请在数据渲染完成后手动触发一次 $('#select2, #select3').trigger('change')；
- 如需支持多选（
- 建议配合 CSS 添加禁用选项的视觉提示（如 option:disabled { color: #999; }）以提升用户体验。
该方案简洁、可复用，适用于任意数量同构下拉框间的互斥选择控制。
