Question

可以通过JQuery注入ejs模板中的HTML吗？

我有一个TestButton文件，其中包含导航栏和内容区域，以及我尝试呈现的示例<ul> . . <li id="listItem"><a href="#test_page">Nav Bar Item</a></li> </ul> <div id="display"> </div> <script> $('#listItem').click( function(){ // Note - testButtonTemplate is being properly passed in from my routes $('#display').html( <%- render( testButtonTemplate, {} ) %> ); }); </script>模板。

Index.ejs

<a href="#" class="btn btn-primary" id="test-button">
    Click Me!
</a>

TestButton.ejs：

display

我尽力简化代码，但基本上，当我点击导航栏中的链接时，我想在<div id="display"> <%- render( testButtonTemplate, {} ) %> </div> div中动态加载页面。

导航栏工作。
点击功能有效如果我手动显示div中的ejs模板，它就可以工作的 EX：

.
.
<script>
$('#listItem').click( function(){
    $('#my-test').html( <a href="#" class="btn btn-primary" id="test-button">
        Click Me!
    </a>
    );
});
</script>

否则，当我尝试使用上面的示例代码加载页面时，这是我得到的错误：
＆＃34; 未捕获的SyntaxError：意外的令牌＆lt; ＆＃34;原始html看起来像：

+---------+---------+
| Lead_ID | Deal_ID |
+---------+---------+
|    2323 | null    |
|    2324 | 1199    |
|    2325 | null    |
|    2326 | null    |
|    2327 | 1080    |
+---------+---------+

所以你可以看到html已经从ejs模板类中正确检索，但是JQuery不喜欢我如何格式化这些数据。看起来数据需要用引号括起来，但只是添加开头和结尾引号并不能解决问题。

我似乎尝试了所有引号，转义和非转义html的组合，先将数据存储在变量中然后尝试注入它，但没有一个对我有效。

我做的是否有明显的错误？我希望在我当前的工具集中解决问题。

Answer 1

尝试加载您的模板：

<script>
var template = new EJS({url: '/TestButton.ejs'});
$('#listItem').click( function(){
     $('#display').html(template.render());
});
</script>

使用JQuery将ejs模板注入html

1 个答案: