Question

在这里提到这个问题，context is not defined javascript

我正在抛出另一个关于错误的问题，即使模板已经编译，document.getElementById也会返回null。

一个简短的背景，我正在使用车把模板，jquery，我希望googlemap出现在1个车把模板中。

我的HTML：

 <script id="employee-tpl" type="text/x-handlebars-template">
<div class='header'><a href='#' class="button header-button header-button-left">Back</a><h1>Gloop</h1></div>
<div class='details'>
    <img class='employee-image' src='img/{{firstName}}_{{lastName}}.jpg' />
    <h1>{{name}}</h1>
    <h2>{{address}}</h2>
    <h2><a href="tel:{{phone}}">{{phone}}</a></h2>
    <span class="location"></span>
    <ul>
        <li><div id="map-canvas"> </div></li>
    </ul>
</div>
</script>

和我的js

this.render = function(){

    this.el.html(EmployeeView.template(employee));
console.log(document.getElementById("map-canvas"));

};
this.initialize = function(){
    this.el=$('<div/>');

};

this.initialize();
}

EmployeeView.template = Handlebars.compile($("#employee-tpl").html());

请注意，对控制台的调用将记录null值，并在我的html文件底部调用此js

<script src="lib/iscroll.js"></script>
<script src="lib/handlebars.js"></script>
<script src="lib/jquery-1.8.2.min.js"></script>
<script src="js/storage/cafe-memory-store.js"></script>
<script src="js/EmployeeView.js"></script>
<script src="js/main.js"></script>
</body>
</html>

我的理解是，我的编译将渲染div，然后应该能够看到但是事实并非如此。谁知道为什么？

Answer 1

这是你的所有代码吗？如果我将它添加到JS它可以工作..但很难看出你在追求什么。

var source = $("#employee-tpl").html(); 
var template = Handlebars.compile(source); 
var data = { //your data here }
$('body').append(template(data));

document.getElementById（#mapid）返回null

1 个答案: