Question

每次用户在搜索框中输入/删除密钥时，我都会调用我的服务器，检索JSON中的大量列表，我在JS中循环访问。为了将数据放到我的模板上，我添加了HTML＆amp;使用Jquery的CSS。这是一个展示我的意思的例子......

<script type="text/javascript">
   $(document).ready(function() {
       $('#input-search').keyup(function(data) { 
        var search = $("#input-search").val();
        $.get("/search/", { search:search }, function(search){
            var matches = (search.search);  
            for (match in matches){
                console.log(matches[match].full_name);
                $(".searchable-container").append("<div>").addClass("items col-xs-12 col-sm-12 col-md-6 col-lg-6").append("<div>").addClass("info-block block-info clearfix").append("<div>").addClass("square-box pull-left").append("<span>").addClass("glyphicon glyphicon-user glyphicon-lg").append("<h5>")
            }});
        });
   });
</script>

我觉得这不是设置返回数据的最佳方式，因为它需要大量的试验和错误，而且看起来很难看。例如，使用Jinja模板，我只需添加{{ curly braces }}即可在需要的地方调用我的数据。鉴于我是JQuery的新手，我只是想知道是否有我遗失的东西，或者更好的方式去做我正在做的事情。

Answer 1

我建议你不要直接附加对象。只需创建它然后追加即可。类似的东西：

var obj1 = $("<div>");
var obj2 = $("<div>");

obj1.addClass(...);
...
$(".searchable-container").append(obj1);
$(".searchable-container").append(obj2);

但这是去IMO的方式。

如何将CSS / HTML添加到Ajax调用

1 个答案: