Javascript 来自 div 值的自动完成源动态不起作用

Question

我正在 php 文件上编写一个 javascript 函数来执行自动完成。我必须从类似于

的 div 值中获取输入

value1
value2
...

输入 div 值是动态的，并且会在某些文本的单击事件中发生变化。所以每次当用户点击这些值时，我都会调用一个名为 test() 的函数来重置自动完成功能。

我正在编写以下代码来获取值，并在编辑发送作为源到自动完成功能后。

Select Value: <input id="autocomplete">

<script type="text/javascript">

        function test()
 {

             var div_values = document.getElementById("id_div_values").innerHTML;
             var div_val_arr = div_values.split("</li>");
             var search_val ="[";


                  for (var j = 0; j < div_val_arr.length-1; j++)
                  {                                                      
                     search_val = search_val+"\""+div_val_arr[j].replace("<li>","")+"\"";

                   }
              search_val = search_val+"]";

            $("#autocomplete").autocomplete({
               source: search_val
            });           

         }
      </script>

但它不起作用。我已经检查了 div 值，它正确地出现并在数组中形成它，但它不工作。如果我把来源设为

source: ["value1","value2","value3","value4"];

那么它工作得很好。我没有得到我做错的地方。提前感谢您的宝贵建议。

Answer 1

您可以通过直接指定 div_val_arr 作为自动完成的来源来检查

$("#autocomplete").autocomplete({
           source: div_val_arr
 });

Answer 2

首先，您缺少在以下代码中附加“,”（逗号）

search_val = search_val+"\""+div_val_arr[j].replace("<li>","")+"\"";

以上代码将生成如下数组：

search_val =["value1""value2""value3""value4"];

添加逗号并确保它将按如下方式生成数组。

search_val =["value1","value2","value3","value4"];

Answer 3

javascript

$(document).ready(function() {
var div_val_arr = [];
$("#id_div_values li").each(function() {
    div_val_arr.push($(this).text());
});
$('#autocomplete').on('focus click touchstart',function() {
$( "#autocomplete" ).autocomplete({
source: div_val_arr
});
});
});

html

    <div id="id_div_values">
        <ul>
    <li>some value</li>
    <li>another value</li>
    <li>value3</li>
    <li>value4</li>
    <li>value5</li></ul>
    </div>

<input type="text" title="search" id="autocomplete">

fiddle http://jsfiddle.net/arfrbzbz/1/

Javascript 来自 div 值的自动完成源动态不起作用

Javascript autocomplete source from div value dynamically not working

javascript

php

autocomplete