第二个 applyBindings 不会触发 [重复]答案

【问题标题】：Second applyBindings doesn't fire [duplicate]第二个 applyBindings 不会触发 [重复]
【发布时间】：2013-01-02 02:43:31
【问题描述】：

可能重复：
KnockoutJS: ko.applyBindings to partial view?

我在 jQuery 中使用淘汰赛。作为下面基本示例的结果，文本 "Planet Earth" 显示正常（因此正确添加了敲除并且有效！），但不显示 "Planet2 Earth2"。此外，alert('alert2'); 会被解雇，但alert('alert3'); 不会。谁能解释一下为什么？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.9.0.min.js" type="text/javascript"></script>
    <script src="Scripts/knockout-2.2.1.js" type="text/javascript"></script>

<script>
    $(document).ready(function () {
        alert("alert1");

        var viewModel = {
            firstName: ko.observable("Planet"),
            lastName: ko.observable("Earth")
        };
        viewModel.fullName = ko.dependentObservable(function () {
            return viewModel.firstName() + " " + viewModel.lastName();
        });

        alert("alert2");
        ko.applyBindings(viewModel);

        alert('alert3');


        var viewModel2 = {
            firstName2: ko.observable("Planet2"),
            lastName2: ko.observable("Earth2")
        };
        viewModel2.fullName2 = ko.dependentObservable(function () {
            return viewModel2.firstName2() + " " + viewModel2.lastName2();
        });

        ko.applyBindings(viewModel2);
    });
</script>
</head>
<body>

<div style="border:1px solid red;">   
<p>First name: <input data-bind='value: firstName' /></p> 
<p>Last name: <input data-bind='value: lastName' /></p> 
<h2>Hello, <span data-bind='text: fullName'> </span>!</h2>  
</div>

<div style="border:1px solid green;">   
<p>First name: <input data-bind='value: firstName2' /></p> 
<p>Last name: <input data-bind='value: lastName2' /></p> 
<h2>Hello, <span data-bind='text: fullName2'> </span>!</h2>  
</div>

</body>
</html>

【问题讨论】：

This question 可能有帮助吗？
没错！我会将更改发布为答案。
感谢您提出问题并分享您的答案！我也会将其标记为重复，以便其他人在登陆时更方便地找到更详细的版本。
没问题！:) 再次感谢！

标签： jquery data-binding input knockout.js knockout-2.0

【解决方案1】：

要使其工作，您必须修改 4 行：

申请ids:

<div id="one" style="border:1px solid red;">

和

<div id="two" style="border:1px solid green;">

和使用 applyBindings 的第二个参数：

ko.applyBindings(viewModel,document.getElementById("one"));

和

ko.applyBindings(viewModel2,document.getElementById("two"));

【讨论】：