1

感谢您的关注!

背景

我意识到已经为其他一些闪亮的对象预留了 jQuery 模板,但无论如何我有义务在我当前的项目中使用该框架。

我正在编写一个动态表单构建器,它接受 JSON,然后呈现正确的表单字段,并绑定到一次性控件的模板。例如,表示基本文本字段的 JSON 对象将对应于这样的模板:

   <!-- BEGIN TEXTBOX TEMPLATE -->
    <script type="text/html" id="Template_TextBox">
        <div class="formField">
            <label>
                ${LabelText}
                <span class="small">${HelpText}</span>
            </label>
            <input type="text" id="${FieldId}" placeholder="${Placeholder}" />
            <div class="clear10"></div>
        </div>
    </script>
    <!-- END TEXTBOX TEMPLATE -->

FormBuilder 类存在于它自己的 JavaScript 文件中,并将在整个项目中使用。

问题

由于此类将用于在整个项目中呈现表单字段,并且由于这些字段看起来总是相同的(即文本输入、选择列表等),我想标准化 jQuery 模板并将它们全部放在一个地方而不必将这些模板粘贴到具有表单的每个页面上。我更愿意在我的FormBuilder.js文件中以某种方式初始化这些模板,其中包含表单构建逻辑的其余部分,或者至少在某个地方有一个包含所有模板的 HTML 页面,并且可以由 .js 文件引用以在整个站点中使用。

这可能吗?如果是这样,怎么做?

4

1 回答 1

2

这比我想象的要容易:

第 1 步:将模板作为 html 字符串放入变量中:

var myTemplate = "<h1>${someItem}</h1>";

第 2 步:缓存模板

$.template("myTemplate", myTemplate);

第 3 步:使用它!

$.tmpl("myTemplate", myJsonData).appendTo("#SomeHtmlElement");
于 2013-03-28T16:42:59.147 回答