Question

我是淘汰js的新手，官方网站上维护的文档不提供完整的html文件。所以我最终编写了自己的脚本标签。当我创建html标记时，它没有按预期工作。然而，只是改变脚本标签的位置使其工作。

我的问题是，当脚本标记放在顶部时，该函数在html body元素中调用之前就可用了。它不是数据绑定，而将脚本放在底部只是解决它。只需重新排序脚本标记的位置，这怎么可能？有人可以提供必须提供的订单。据我所知，许多人更喜欢将脚本放在最后，以便DOM完全准备好并考虑速度。

我的代码如下：

不绑定数据。

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
</head>
<body>
<script type="text/javascript">
var myViewModel = {personName:'Bob', personAge:31};
ko.applyBindings(myViewModel);
</script>

The name is <span data-bind="text: personName"></span>

</body>
</html>

作品

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
</head>
<body>
The name is <span data-bind="text: personName"></span>
<script type="text/javascript">
var myViewModel = {personName:'Bob', personAge:31};
ko.applyBindings(myViewModel);
</script>

</body>
</html>

Answer 1

当ko.applyBindings被调用时，knockout会在文档中搜索任何数据绑定标记并应用适当的绑定。因此，在调用ko.applyBindings之前必须已加载文档和任何数据绑定标记，否则knockout将找不到要绑定的内容。

你有几个选择：

将applyBindings移动到文档的底部，其中任何数据绑定在被调用时已经存在。
在回调函数中包装applyBindings，以便可以在任何地方定义它，但是等待执行直到文档加载完毕。为此，您可以使用jQuery＆＃39; $(document).ready()，或者如果您没有jQuery，请参阅此SO question了解其他等效选项

KnockOut js脚本标记不应用数据绑定

1 个答案: