JQueryUI自动完成功能不会从选择框中更新其数据属性

Question

例

$('select').change(function(){
      $('#auto').attr('data-id',$(this).val())
})

$('#auto').autocomplete({
    delay: 1000,
    source: function( request, response ) {  
            alert($(this.element).data('id'))
            return false
    }
 })

<select name="category">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

<input id="auto" data-id="A" type="search"/>

当有人在选择框中选择一个选项时，我想更新自动输入数据属性。

有什么方法可以防止自动完成输入缓存其数据属性？ 第一次将选择框中的选项从A更改为B时，输入即可更新data-id 。 但是，当我从B更改为C ，输入仍在提醒B而不是C $(this.element).data('id')不是获取最新数据属性的适当方法？

Answer 1

直接从select控件中选择值怎么样？

$('#auto').autocomplete({ 
   delay: 100,
   source: function( request, response ) {  
      var selected = $('select[name="category"] option:selected'), 
          isSomethingSelected = selected.length == 1,
          selectedVal = isSomethingSelected ? 
                        selected.val() :  
                        $('select[name="category"] option:first').val();
      alert(selectedVal);
      return false;
   }
});

见JSFiddle