使用Knockout.js准备好jQuery文档

Question

我刚刚进入Umbraco ASP.NET CMS进行我的最新项目，我不确定这是否是全面的，但对于我的设置Knockout.js正在做所有的模板。

我不是太热衷于knockout.js但是到目前为止它一直很简单，除了当我开始添加一些jQuery的东西时，我遇到的问题是jQuery在敲除之前已经完成了填充页面的所有元素。

到目前为止，唯一对我有用的解决方案是我的所有jQuery内容都包含在setTimeout（）函数中，这显然是不行的。

使jQuery和Knockout协同工作的最有效方法是什么，所以jQuery在敲除之前不会完成？

Answer 1

我最近遇到了与jSignature插件和我的Knockout视图相同的问题。 在调用jSignature之前，我需要KO视图完全呈现，否则它本身的大小不正确。

我用模板绑定和afterRender回调函数修复它来调用jQuery工作。

这是KO文档：

http://knockoutjs.com/documentation/template-binding.html

这是一个快速的jsfiddle，展示了如何使用它：

http://jsfiddle.net/PCbFZ/

诀窍是你可以使用模板绑定的afterRender回调而不实际使用模板本身。 相反，您将所有现有HTML包装在将调用afterRender回调的div中：

<div data-bind="template: {afterRender: initApp}">
  <!-- your existing HTML here -->
</div>

initApp是执行jQuery工作的函数。

我认为通常应该做你需要的，但如果你的HTML特别复杂，或者你需要在一个页面内渲染很多视图，你可能需要做更多的工作。 让我知道你是如何进行的 - 也许我可以尝试多一点帮助，如果这不能像我一样轻松解决你的问题！

---

更新 - 遵循下面JACL的评论 - 这里是小提琴的扩展版本，显示此技术也与ko-if一起使用。 每次使用复选框显示/隐藏“小部件”时，都会应用不同的随机颜色来指示afterRender功能执行其工作。

http://jsfiddle.net/PCbFZ/15/

Answer 2

也许window.load而不是document.ready将成功

Answer 3

您可以使用： $(window).load(function(){ /* code */ }); 而不是$(document).ready();