JQuery自动完成错误

时间:2014-07-10 18:13:54

标签: javascript jquery autocomplete

我正在尝试创建一个包含120个自动完成的txtbox的页面,用于在我的索引页面和我的上创建一个循环 js页面。但是

似乎出了问题
  var a = "#A" + i;
  var b = "#B" + i;
  var c = "#C" + i;

  $(a).html(thehtml);
  $(b).html(thehtml2);
  $(c).html(thehtml3);

但如果我的代码是

  var a = "#A1";
  var b = "#B1";
  var c = "#C1";

  $(a).html(thehtml);
  $(b).html(thehtml2);
  $(c).html(thehtml3);

第一个自动填充框工作正常,但其余部分无效,因为它们具有不同的ID

索引页

 <!doctype html>
  <html lang="en-US">
  <head>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
  <link rel="stylesheet" type="text/css" media="all" href="style.css">
  <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
  <script type="text/javascript" src="js/jquery.autocomplete.min.js"></script>
  <script type="text/javascript" src="js/currency-autocomplete.js"></script>
  </head>

  <body>
  <div id="w">
  <div id="content">
  <h1>Folders</h1>

  <div id="searchfield">
  <table>
  <th>Folder art</th>
  <th>Artnr</th>
  <th>zoekterm</th>
  <th>Omschrijving</th>
  <th>BTW</th>


  <?php
  //teller defineren
  $i=0;
  $id=1;


  while($i<120)
  {
   $id_name="autocomplete".$id;
   $A="A".$id;
   $B="B".$id;
   $C="C".$id;


   if($id < 10)
   {$art="FS000".$id;}
   else if($id < 100)
   {$art="FS00".$id;}
   else
   {$art="FS0".$id;}

   echo "<tr>";
   echo "<td><input type=\"text\" name=\"$art\" value=\"$art\" size=\"10\"></td>";
   echo "<td><div id=\"$B\"></div></td>";


   echo "<td><input type=\"text\" name=\"$id_name\"  id=\"$id_name\"></td>";


   echo "<td><div id=\"$A\"></div></td>";
   echo "<td><div id=\"$C\"></div></td>";

   $id++;
   $i++;   
  }      
  ?>
  </table>
  </div>
  </body>
  </html>  

自动填充代码.js

$(function(){
 var currencies = [
{ value: 'Afghan afghani', data: 'AFN',BTW: '2' },
{ value: 'Albanian lek', data: 'ALL',BTW: '2' },
{ value: 'Algerian dinar', data: 'DZD',BTW: '2' },
{ value: 'European euro', data: 'EUR',BTW: '2' },
{ value: 'Angolan kwanza', data: 'AOA',BTW: '4' },
{ value: 'East Caribbean dollar', data: 'XCD',BTW: '4' },
{ value: 'Argentine peso', data: 'ARS',BTW: '2' },
{ value: 'Armenian dram', data: 'AMD',BTW: '2' },
{ value: 'Aruban florin', data: 'AWG',BTW: '2' },
{ value: 'Australian dollar', data: 'AUD',BTW: '4' },
{ value: 'Azerbaijani manat', data: 'AZN',BTW: '8' },
];
var z = "#autocomplete";

var id=1;
var i=0;
var aantal=120;

for ( var i = 1; i < 120; i++ ){

$(z + id).autocomplete({
lookup: currencies,
onSelect: function (suggestion) {  

  var thehtml='<input type=\"text\"  value=\"'+ suggestion.value + '\">';
  var thehtml2='<input type=\"text\" value=\"'+ suggestion.data + '\" size=\"10\">';
  var thehtml3='<input type=\"text\"  value=\"'+ suggestion.BTW + '\" size=\"5\">';

  var a = "#A" + i;
  var b = "#B" + i;
  var c = "#C" + i;

  $(a).html(thehtml);
  $(b).html(thehtml2);
  $(c).html(thehtml3);
}


});
id++;}

});

错误是什么? 结果正常代码 Result normal code 更改代码后的结果 Result after changing the code

1 个答案:

答案 0 :(得分:0)

我发现了问题,将变量更改为t并在循环内定义它。

for ( var i = 1; i < 120; i++ ){
var t=1;
$(z + id).autocomplete({
lookup: currencies,
onSelect: function (suggestion) {  

  var thehtml='<input type=\"text\"  value=\"'+ suggestion.value + '\">';
  var thehtml2='<input type=\"text\" value=\"'+ suggestion.data + '\" size=\"10\">';
  var thehtml3='<input type=\"text\"  value=\"'+ suggestion.BTW + '\" size=\"5\">';



  var a = "#A"+t;
  var b = "#B"+t;
  var c = "#C"+t;

  $(a).html(thehtml);
  $(b).html(thehtml2);
  $(c).html(thehtml3);
t++;