jQuery _renderItem顯示項目列表？

我正在嘗試使用jQuerys自動完成功能顯示項目列表。這是我的成功函數代碼：jQuery _renderItem顯示項目列表？

success: function (data) { 
     response($.map(data, function(v,i){ 
      parsedObjects = data['region.regions'][0]['region']; 

      var item = []; 
      var len = parsedObjects.length; 
      for (var i = 0; i < len; i++) { 
       var obj = { name: parsedObjects[i]['name'], value: parsedObjects[i]['geoCodeId'] }; 
       item.push(obj); 
      } 
      console.log(item); 

      response(item); 

     })); 
    }

item對象具有我需要的所有名稱/值對。現在，我如何在自動完成輸入中顯示這些內容？

我_renderItem看起來像這樣：

function (ul, item) { 
    return $("<li>") 
     .attr("data-value", item.value) 
     .append(item.label) 
     .appendTo(ul); 
};

我必須使用循環或東西嗎？

感謝您的幫助！

來源

2015-12-01 Arnie

嘗試類似這樣的事情。任何方式你的方法都不太好。如果你想實現自動完成插件使用jQuery在構建功能類似下面

success: function (data) { 
     response($.map(data, function(v,i){ 
      parsedObjects = data['region.regions'][0]['region']; 

      var item = []; 
      var len = parsedObjects.length; 
      for (var i = 0; i < i.length; i++) { 
       var obj = { name: parsedObjects[i]['name'], value: parsedObjects[i]['geoCodeId'] }; 
       $("#list_cont").append(getElement(obj)); 
       item.push(obj); 
      } 

      console.log(item); 

      response(item); 

     })); 
    } 


    function getElement(item) { 
     return $("<li>") 
      .attr("data-value", item.value) 
      .append(item.label);   
    };

你的HTML應該有這樣的事情

<ul id="list_cont" ></ul>

。

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Autocomplete - Default functionality</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <script> 
    $(function() { 
    var availableTags = [ 
     "ActionScript", 
     "AppleScript", 
     "Asp", 
     "BASIC", 
     "C", 
     "C++", 
     "Clojure", 
     "COBOL", 
     "ColdFusion", 
     "Erlang", 
     "Fortran", 
     "Groovy", 
     "Haskell", 
     "Java", 
     "JavaScript", 
     "Lisp", 
     "Perl", 
     "PHP", 
     "Python", 
     "Ruby", 
     "Scala", 
     "Scheme" 
    ]; 
    $("#tags").autocomplete({ 
     source: availableTags 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div class="ui-widget"> 
    <label for="tags">Tags: </label> 
    <input id="tags"> 
</div> 


</body> 
</html>

更多信息參見this

來源

2015-12-01 08:06:31

爲什麼我的做法不太好？我還能怎麼做呢？ – Arnie

我的意思是你可以使用構建的jquery功能而不是做太多。 –

是的，但如何:) ...你的想法不順利btw。 – Arnie

jQuery _renderItem顯示項目列表？

回答

相關問題