JQuery自动完成源不更新

Posted 2023-05-08

技术标签:

【中文标题】JQuery自动完成源不更新【英文标题】：JQuery Autocomplete source not updating 【发布时间】：2019-06-11 07:30:24 【问题描述】：

我正在使用jquery-ui autocomplete 插件。

这是我实例化自动完成插件的方式。

//autofill
$( "#TextArea" ).autocomplete(
    source: "search.php?option="+ option.toLowerCase(),
    minLength: 3
);

在下拉更改时，我正在尝试更改选项：

$('#Options').on('change',  function() 
        option = this.value.toLowerCase();
        var teaxtarea = $('#TextArea');
        //this is supposed to change the source string when the option value changes.
        teaxtarea.autocomplete( "option", "source", "search.php?option="+ option);
    
);

我从下面的问题中获得了更新源字符串的代码。

Jquery: Possible to dynamically change source of Autocomplete widget?

但是，这个解决方案似乎对我不起作用。

即使我更改下拉列表中的选项，我仍然会得到第一个选择的选项。非常感谢任何帮助。

【问题讨论】：

出于好奇，您为什么要在用户键入时更改数据源？ option = this.value.toLowerCase(); "search.php?option="+ option 与之前的 "search.php?option="+ option.toLowerCase(), 不一样，那么您期望结果有什么变化？更深入地查看示例，我发现它们正在根据特定更改更新源代码。无论如何，您可能都想使用“函数”源，因为您可以确保浏览器不会使用更复杂的 AJAX 调用来缓存值。 @TJ ，我有一个下拉菜单和一个文本区域。 #options 是下拉菜单，#textarea 是文本字段。我需要的是，根据下拉列表中选择的值在文本区域中获取自动填充建议。 【参考方案1】：

建议如下：

$("#TextArea").autocomplete(
    source: function(req, resp)
      var option = $('#Options option:selected').val().toLowerCase();
      $.ajax(
        cache: false,
        url: "search.php",
        data: 
          option: option,
          term: req.term
        ,
        dataType: "json",
        success: function(data)
          resp(data);
        
      );
    ,
    minLength: 3
);

我认为一个问题是，如果#Options 是<select> 元素，则需要找到选中的子元素：