Question

我尝试制作一个jquery模板，但我每次都停留在jQuery的中间。这是我的代码：

var json = [{"threadid":"1","username":"dvsdvs"},{"threadid":"32","username":"rgfedvre"}];
var template = '<li id="thread_{threadid}">{username}</li>';
 jQuery.each(json, function(index, value) {
  jQuery.each(value, function(subindex, subvalue) {
   template = template.replace('{' + subindex + '}', value[subindex]);
  });
 $(template).appendTo('body');
});

但结果总是

<li id="thread_1">dvsdvs</li>
<li id="thread_1">dvsdvs</li>

我想得到一些帮助，谢谢。

Answer 1

每次都以新模板开头（因此有占位符可用），或者替换为临时变量，并追加：

var json = [{"threadid":"1","username":"dvsdvs"},{"threadid":"32","username":"rgfedvre"}];

var template = '<li id="thread_{threadid}">{username}</li>';

jQuery.each(json, function(index, value) {
  var t = template;
   
  jQuery.each(value, function(subindex, subvalue) {
    t = t.replace('{' + subindex + '}', value[subindex]);
  });
   
  $(t).appendTo('body');
});

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

Answer 2

逻辑错误。您在第一次通过循环时覆盖了原始模板，然后在第二次传递时无法找到占位符。只需在每次迭代时重新定义模板。

＆＃13;

var json = [{"threadid":"1","username":"dvsdvs"},{"threadid":"32","username":"rgfedvre"}];
jQuery.each(json, function(index, value) {
    var template = '<li id="thread_{threadid}">{username}</li>';
    jQuery.each(value, function(subindex, subvalue) {
        template = template.replace('{' + subindex + '}', subvalue);
    });
    $(template).appendTo('body');
});

＆＃13;

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

＆＃13;

jQuery每个返回相同的结果

2 个答案: