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

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

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">

小提琴 http://jsfiddle.net/arfrbzbz/1/

Answer 2

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

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

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

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

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

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