2

我正在使用 jquery-tmpl 模板库来构建动态<select>列表。在我的模板中，我有一个函数调用，它返回页面上<option>现有<select>元素的所有元素。

在我的模板中，函数调用成功执行并.html()从现有<select>列表中返回，但将其呈现为 DOM 中的文本，而不是将 HTML 附加到<select>列表中。

我知道我的函数只返回一个字符串并且看起来被视为这样，但我不知道如何实际获取<select>对模板中元素的引用以执行任何 jQuery 功能。

如何将<option>列表附加到模板 HTML 元素，或获取对模板元素的引用？

这是我的模板：

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

我的函数将<option>集合作为字符串返回：

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

提前致谢！！

4

1 回答 1

2

好的，知道了，对不起。花了几个小时试图解决这个问题，并在发布后几分钟找到了解决方案（打脸）。

我找到的解决方案是使用插件的编译模板功能。我之前尝试过使用$.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();
}

向任何对此进行调查的人道歉，但希望这会帮助其他人。

于 2010-09-21T21:26:27.237 回答