Question

我的Jquery自动完成代码存在问题，如果我使用声明的VAR它可以工作，如果我从div的内部html中获取相同的数据它不会。

这是html

<div id="search_data">
['animal','alison','App','apple','apricot','tennis','terrible']
</div>

<input id="Text2" type="text" />

<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
//This option works
var tags = ['c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 
'ruby'];

//This does not, but why?       
var newdata = document.getElementById("search_data").innerHTML

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

以下是JSFiddle的问题

JS fiddle link

Answer 1

试试这个

   
   //This option works
   var tags = ['c++', 'java', 'php', 'coldfusion', 'javascript', 'asp', 'ruby'];

		//This does not, but why?		
    var temp = [];
     
    var span = document.getElementsByClassName("a");

    for(var i = 0; i< span.length; i++)
    {
    	temp.push(span[i].innerHTML);
    }
$("#Text2").autocomplete({
source: temp
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="search_data">
  ['animal','alison','App','apple','apricot','tennis','terrible']
  <span class="a">animal</span>
  <span class="a">alison</span>
  <span class="a">App</span>
  <span class="a">apple</span>
  <span class="a">apricot</span>
  <span class="a">tennis</span>
   <span class="a">terrible</span>
</div>

<input id="Text2" type="text" />

<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Answer 2

从阿里向正确的方向推进，我已经解决了我的问题。

<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>

<div id="search_data1">
animal,alison,App,apple,apricot,tennis,terrible
</div>

<input id="Text2" type="text" />

<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>



var newspan = document.getElementById("search_data1").innerHTML

var array = newspan.split(",")

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

JSFiddle - https://jsfiddle.net/pw_2002uk/d61b1swL/

Jquery自动完成问题

2 个答案: