如何使用jquery模板在飞行jquery对象上使用？

Question

当我传递以下jquery锚点对象时，我的jquery模板显示[object Object]。

    moreinfoAnchor = $("<a></a>");
    moreinfoAnchor.attr('id', 'moreLink-' + this.id);
    moreinfoAnchor.text("test");

jquery模板代码：

$("#test").tmpl({
   link: moreinfoAnchor
});

如何使用jquery模板显示实际锚点？

Answer 1

这是一种方法。

使用jQuery构建锚标记：

var moreinfoAnchor = $("<a></a>")
  .attr({
    'href' : 'http://www.example.com',
    'id' : 'moreLink'
  })
  .text("test");

将您的jQuery锚标记转换为纯字符串：

var plainString = $('<div>')
  .append( moreinfoAnchor.clone() ).remove().html();

然后应用模板：

$("#test").tmpl({
  link: plainString
}).appendTo('#thediv');

您还必须确保使用html模板标记设置模板，如下所示：

<script id="test" type="text/x-jquery-tmpl">
  <div>{{html link}}</div>
</script>