代码之家 › 专栏 › 技术社区 › jaywon

通过jquery tmpl中的函数调用追加动态HTML元素

jquery-templates templates jquery

2

jaywon · 技术社区 · 14 年前

我使用jquery tmpl模板库来构建一个动态 <select> <option> 来自现有 <选择> 页面上的元素。

在我的模板中,函数调用成功执行并返回 .html() <选择> <选择>

我知道我的函数只返回一个字符串,看起来是这样对待的,但我不知道如何实际获取对 <选择>

如何附加 <选项> 列表到template HTML元素,还是获取对template元素的引用?

这是我的模板:

<script id="searchTemplate" type="text/x-jquery-tmpl">
    <select id="destinations" class="destinations">
        ${getDestinationList()}
    </select>
</script>

以及我返回 <选项> 作为字符串的集合:

function getDestinationList(){
    return $("#tabs-0 select[id$='destinations']").html(); //returns HTML list as string successfully
}

提前谢谢!!

1 回复 | 直到 14 年前

1

2

jaywon 14 年前

好吧,明白了,抱歉。花了几个小时试图弄明白这一点,并找到了解决办法后几分钟张贴(脸巴掌)。

$.template( "#destinationList", getDestinationList() ); 浏览器中出现脚本错误。原来我使用的是一个旧版本的插件,而函数实际上有签名 $.templates(name, tmpl) $.template(name, tmpl) 与当前的文档一起。不知道什么时候变了,但是。。。

在了解了这一点之后,我能够正确地使用编译后的模板功能:

<script id="searchTemplate" type="text/x-jquery-tmpl">
   <select id="destinations" class="destinations">
      {{tmpl "#destinationList"}}
   </select>
</script>

在页面加载中定义编译模板,如下所示:

$(function(){
    $.template( "#destinationList", getDestinationList() );
});

function getDestinationList(){
    return $("#tabs-0 select[id$='destinations']").html();
}

向调查此事的任何人道歉,但希望这能帮助其他人。