jQuery获取无name/id输入框值：Bootstrap组合框插件问题求助

嘿，这种第三方插件没留关键属性的情况确实头疼，我给你几个实用的解决方案，应该能帮你拿到选中的值：

• 利用原隐藏的<select>元素
  这类下拉增强插件通常不会删除原有的<select>标签，只是把它隐藏起来，并且会将选中的值同步到这个原元素上。你可以直接通过原select的id或name来获取值：

  // 假设原select的id是"my-original-select"
  var selectedValue = $('#my-original-select').val();
  console.log(selectedValue);
  

  可以打开浏览器开发者工具（F12），在Elements面板里搜原select的id，确认它是否存在且值会随选择变化。

• 动态给生成的输入框添加id/name属性
  插件初始化完成后，用jQuery选择器定位到它生成的输入框（通常会有特定的类名，比如combobox-input），手动添加id和name：

  // 初始化插件之后执行
  $('.combobox-input').attr({
    'id': 'custom-combobox-input',
    'name': 'custom-combobox-name'
  });
  // 之后就能正常绑定事件或获取值了
  $('#custom-combobox-input').on('change', function() {
    console.log($(this).val());
  });
  

• 监听插件的自定义事件
  很多这类插件会在选中选项时触发自定义事件，你可以尝试绑定这类事件来获取选中项信息：

  // 监听插件容器的选中事件（事件名可以试试combobox:selected、change等）
  $('.combobox-container').on('combobox:selected', function(e, item) {
    console.log('选中值：', item.value);
    console.log('选中文本：', item.text);
  });
  

  如果不确定事件名，可以在开发者工具的Event Listeners面板里查看插件容器上绑定的事件。

• 直接监听下拉选项的点击事件
  找到插件生成的下拉菜单选项，绑定点击事件来获取值：

  // 假设下拉选项的选择器是.combobox-menu li a
  $('.combobox-menu li a').on('click', function() {
    // 查看元素上的data属性或文本内容，比如data-value
    var selectedValue = $(this).data('value');
    // 如果没有data属性，也可以从原select同步获取（方法一）
    console.log(selectedValue);
  });
  

先试试第一种方法，大多数这类插件都会同步原select的值，这是最省心的方案。如果不行，再根据DOM结构调整后面的方法~

内容的提问来源于stack exchange，提问作者user340581