3

JSON 配列から国を一覧表示するオートコンプリート コードを作成しています。正常に動作しますが、コンソールにエラーが表示されます。いつ害になるかわかりません。これを解決するのを手伝ってもらえますか?

CSS

.mainpart {
    width:100%;
    height:auto;
}
.first {
    width:150px;
    height:25px;
    float:left
}
.second {
    width:150px;
    height:25px;
    float:left
}
ul, li {
    list-style:none;
}
.li-autoList {
    background-color:#CBCACC;
    border:1px solid #fff;
    cursor:pointer;
}

HTML

<div class="mainpart">
    <div class="first">
        <input type="text" id="county" onclick="autoList('#county','country')" />
    </div>
    <div class="second">
        <input type="text" id="county2" onclick="autoList('#county2','city')" />
    </div>
</div>

JS

<script type="text/javascript">
  function autoSort(id,list){

    if(list=='country'){
      county=(co.response.data);
    }else{
      county=(ci.response.data);    
    }

    li='';

    for(i=0;i<county.length;i++){
      c=$(id).val().toUpperCase().replace(/["'\(\)]/g, "");
      conDec=county[i].description+'('+county[i].cod+')';
      conDec=conDec.toUpperCase().replace(/["'\(\)]/g, "");
      n=(conDec.search(c));

      if(n>=0){
        cname=county[i].description+'('+county[i].cod+')';
        li+='<li class="li-autoList"><input type="checkbox" class="itm"    value="'+county[i].description+'('+county[i].cod+')">'+county[i].description+'</li>';
      }

    }

    $('.li-autoList').remove();
    $(id).after(li);
  }

  function autoList(id,list){

    if(list=='country'){
      county=(co.response.data);
    }else{
      county=(ci.response.data);    
    }

    li='';

    for(i=0;i<county.length;i++){
      c=$(id).val().toUpperCase().replace(/["'\(\)]/g, "");
      conDec=county[i].description+'('+county[i].cod+')';
      conDec=conDec.toUpperCase().replace(/["'\(\)]/g, "");
      n=(conDec.search(c));
      chk='';

      if(conDec==c){
        chk='checked';
      }

      cname=county[i].description+'('+county[i].cod+')';
      li+='<li class="li-autoList liItm"><input type="checkbox" '+chk+' class="itm"   value="'+county[i].description+'('+county[i].cod+')">'+county[i].description+'</li>';
    }

    $('.li-autoList').remove();
    $(id).after(li);

    $('.itm').click(function(){ $(id).val( $(this).val()); 
      $('.li-autoList').remove();
      //  autoList(id,list);
    });

    $('.liItm').click(function(){ 
      //  $(id).val( $(this).val()); 
      var cb = $(this).find(":checkbox")[0];
      $(id).attr('checked',true);
      $(id).val( $(cb).val()); 
      $('.li-autoList').remove();
      //  autoList(id,list);
    }); 

    $(id).bind({
      'keyup': function() {
        $('.itm').removeAttr('checked');    
        autoSort(id,list)
      },
      blur: function() {
        //if checkbox checked
        if(!$('.itm').attr('checked'&&( $(id).val()==''))){
          $(id).val(null);
          autoList(id,list)
        }

      }
    });
  }
  var ci={"response":{"status":"0", "data":[{"cod":"SLST" ,"description":"San Luis Talpa"      , "group":"SV"},{"cod":"SA6" ,"description":"San Salvador" , "group":"SV"}]}}; 
  var co={"response":{"status":"0", "data":[{"cod":"FR-AG" ,"description":"Agay" , "group":"Altro"},{"cod":"FR-AI" ,"description":"Aix En Provence" , "group":"Altro"},{"cod":"AL" ,"description":"Albania" , "group":"Le più cliccate"},{"cod":"DZ" ,"description":"Algeria" , "group":"Altro"},{"cod":"FR-AM" ,"description":"Amiens" , "group":"Altro"},{"cod":"AD" ,"description":"Andorra" , "group":"Altro"},{"cod":"ZW" ,"description":"Zimbabwe" , "group":"Altro"}]}};
</script>
</body>
4

1 に答える 1