获取“无法读取 null 的属性‘nodeType’"；调用 ko.applyBindings 时 [英] Getting "Cannot read property 'nodeType' of null" when calling ko.applyBindings
问题描述
我有这个淘汰码:
function Task(data) {
this.title = ko.observable(data.title);
this.isDone = ko.observable(data.isDone);
}
function TaskListViewModel() {
// Data
var self = this;
self.tasks = ko.observableArray([]);
self.newTaskText = ko.observable();
self.incompleteTasks = ko.computed(function() {
return ko.utils.arrayFilter(self.tasks(), function(task) { return !task.isDone() });
});
// Operations
self.addTask = function() {
self.tasks.push(new Task({ title: this.newTaskText() }));
self.newTaskText("");
};
self.removeTask = function(task) { self.tasks.remove(task) };
}
ko.applyBindings(new TaskListViewModel());
这个html:
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="knockout-2.0.0.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<h3>Tasks</h3>
<form data-bind="submit: addTask">
Add task: <input data-bind="value: newTaskText" placeholder="What needs to be done?" />
<button type="submit">Add</button>
</form>
<ul data-bind="foreach: tasks, visible: tasks().length > 0">
<li>
<input type="checkbox" data-bind="checked: isDone" />
<input data-bind="value: title, disable: isDone" />
<a href="#" data-bind="click: $parent.removeTask">Delete</a>
</li>
</ul>
You have <b data-bind="text: incompleteTasks().length"> </b> incomplete task(s)
<span data-bind="visible: incompleteTasks().length == 0"> - it's beer time!</span>
</body>
该示例与在 Knockout 网站上找到的示例相同，但是当我运行它时，它在 Chrome Fire Bug 上返回此消息:
The example is the same as the one found on the Knockout website, but when I run it, it returns this message on Chrome Fire Bug:
未捕获的类型错误:无法读取 null 的属性nodeType"
Uncaught TypeError: Cannot read property 'nodeType' of null
这个与淘汰文件和我脚本的这一行有关:
This one is related to the knockout file and to this line of my script:
ko.applyBindings(new TaskListViewModel());
并且这个错误在淘汰赛中指向这一行(1766):
And this error is pointing to this line (1766) on knockout:
var isElement = (nodeVerified.nodeType == 1);
我做错了什么?
推荐答案
发生这个问题是因为我试图在创建之前绑定 HTML 元素.
This problem was happening because I was trying to bind an HTML element before it was created.
我的脚本加载在 HTML 顶部(在头部)但它需要加载在我的 HTML 代码底部(就在结束正文之前标签).
My script was loaded on top of the HTML (in the head) but it needed to be loaded at the bottom of my HTML code (just before the closing body tag).
感谢您的关注 James Allardice.
一种可能的解决方法是使用 defer="defer"
A possible workaround is using defer="defer"
<script src="script.js" type="text/javascript" defer="defer"></script>
如果脚本不会生成任何文档内容，请使用此选项.这将告诉浏览器它可以在加载脚本之前等待内容加载完毕.
Use this if the script is not going to generate any document content. This will tell the browser that it can wait for the content to be loaded before loading the script.
希望有帮助.
这篇关于获取“无法读取 null 的属性‘nodeType’"；调用 ko.applyBindings 时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
