document.getElementById(#mapid) returns null

document.getElementById(#mapid) returns null

本文关键字：returns null #mapid getElementById document      更新时间：2024-05-30

这里提到这个问题，上下文没有定义javascript

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

一个简短的背景，我正在使用手柄模板，jquery和我想要一个谷歌地图出现在手柄模板的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值，这个js是在我的html文件的底部调用的

<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，然后应该可以看到它，但事实并非如此。有人知道为什么吗？

这是你所有的代码吗？如果我把它添加到JS中，它就会起作用。。但很难看出你在追求什么。

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