Question

我正在php文件上编写一个javascript函数来执行自动完成功能。我必须从div值中获取输入，如

value1
value2
...

输入div值是动态的，并在某些文本的click事件上发生变化。所以每当用户点击这些值时，我都会调用一个名为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

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

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

上面的代码将使数组如下：

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

添加逗号并确保它将生成数组，如下所示。

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

Answer 2

<强>的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 3

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

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

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

3 个答案: