Javascript 内联编辑时，删除绑定不起作用

我试着创建一个带knockout的内联编辑

• 我为同一个字段创建了“span”和“input”
• 单击跨度时，我隐藏跨度并“显示”输入
• 但输入的变化并不是跨度的反映

我的Html字段

<td>
    <span data-bind="text: name" style="display: inline;">Furious Lizard</span> 
    <input data-bind="value: name" style="display: none;" type="text">
</td>

为什么装订不起作用

---

我认为原因是，即使您绑定到一个

observableArray

，对象上的属性本身也不可见，因此当属性被更改时，其他绑定元素不会被通知更改

我已编辑了您的示例：

在这里，您可以看到数据中的第一个元素，而不仅仅是标准属性，它们也是可观察的：

{
    name: ko.observable("Well-Travelled Kitten"),
    model: ko.observable(352),
    price: 75.95
}

注意：我没有修改价格，因为您在下面使用它进行计算。为了实现这一点，您必须修改所有价格以使其可见，然后在计算时实际调用可观察值（使用括号）以获得实际值

为了避免手动为每个属性创建可观察对象，Knockout有一个名为“映射””的插件，它使用以下语法实现了这一点：

var viewModel = ko.mapping.fromJS(data);

现在，关于您的第二个JSFIDLE，我刚刚做了一些更正：

---

添加元素时，新元素上的属性不可见，评估price属性时也缺少括号。

是否希望输入中写入的数据在span元素中作为文本可见？

---

$（this.find（'span'）.html（$（this.find（'input'）.val（））

你能指导我怎么做吗？我对这个东西不熟悉有没有办法把整个JSON映射成可观察的。嗨，我已经更新了我的代码这次如何改变总数？刚刚更新了我的答案，以防你想知道为什么你的第二次尝试不起作用。但是，还是要进行映射，它更简单，代码更少。正确，因为当您更新值时，属性而不是数字会变成文本。我对它做了一点修改，以便在计算价格时将其解析回float。

var viewModel = ko.mapping.fromJS(data);