Question

如果绑定，我遇到了knockoutjs的问题。我非常自由地使用绑定，因为它允许我在绑定中引用子属性而不会出错。

关注的一个原因是在由if绑定添加的DOM元素上注册事件处理程序等。基本上我需要在if绑定添加的元素添加到DOM时获得回调。我尝试过使用livequery jquery插件，但似乎元素被添加了两次。我想出了一些示例代码来展示这一点。

淘汰赛文档明确指出：

“但是，if绑定会物理地添加或删除DOM中包含的标记，并且只有在表达式为真时才对后代应用绑定。”

但是，在以下代码中，内联脚本中的警报执行：

JS：

var vm = {
    val: ko.observable(false),
    someText: ko.observable("some text"),
};

ko.applyBindings(vm, document.getElementById("d1")

HTML：

<div id="d1" data-bind="if: val">
   <span data-bind="text: someText"></span>
   <script>alert("here")</script>
</div>

Answer 1

你已经基本上用这句话回答了你自己的问题：

“但是，if绑定会物理地添加或删除包含的内容您的DOM中的标记，并且仅对后代应用绑定表达是真的。“

虽然此引用清楚地表明了绑定的行为，但它没有说明其他JavaScript或浏览器功能。这是完全合理的，因为Knockout的域名是它的绑定而不是别的。在Knockout加载时，您的浏览器已经执行了该alert-statement。每次Knockout将其添加回DOM树时，它都会执行该alert语句。

将这样的<script>元素与Knockout结合使用是不好的做法，可能导致不可预测的行为。你想要做的是表达Knockout领域的预期行为，它是它的绑定。在您的情况下，这将适合afterRender绑定：

<div id="d1" data-bind="if: val">
   <span data-bind="text: someText, afterRender: alert('here')"></span>
</div>

如果val为true，则会呈现内部<span>并触发afterRender事件。

如果val为false，那么内部<span>将不呈现，afterRender事件将不火。

Answer 2

好的，我想出了我需要做的事情。显然，'if'绑定实际上是模板绑定的原生/简化扩展：

模板绑定还有afterRender选项，您可以传递一个函数，该函数将在整个模板添加到DOM后执行。

我的代码现在看起来像这样：

<div data-bind="template: {if: val, afterRender: func}">

注意：

这也可以使用'with'绑定，当然还有'foreach'绑定。