将 jQuery 事件函数应用于新的 Knockout.js 数组元素答案

【问题标题】：Applying jQuery event functions to new Knockout.js array elements将 jQuery 事件函数应用于新的 Knockout.js 数组元素
【发布时间】：2015-04-14 01:13:21
【问题描述】：

我有一个带有products 列表的 Knockout.js 视图模型，由 ASP.NET Web API 调用填充：

// Define viewmodel
var myViewModel = {
    products = ko.observableArray([]);
};

// Apply knockout bindings
ko.applyBindings(vm);

// Function that obtains product data
function listProducts(viewmodel) {
    var productsQuery = "api/products/get";

    // Send an AJAX request
    $.getJSON(productsQuery).done(viewmodel.products);
}

当我调用listProducts 时，每个元素都成功添加到了ff 中。 HTML<ul>:

<ul data-bind="foreach: products">
    <li class="item">
        <data-bind="text: productName">
    </li>
</ul>

但是，当添加每个项目时，适用于我的.item 元素的 jQuery 函数：

$(".item").click(function () {
    $(this).toggleClass("selected");
});

不会应用于这些新添加的元素。

问题：如何向 Knockout.js observableArray 添加元素，同时继承其相应的 jQuery 方法？

【问题讨论】：

标签： javascript jquery html knockout.js ko.observablearray

【解决方案1】：

基本上，您需要回到淘汰赛文档并阅读、阅读、阅读！忘记用 jquery 做这个，这不是 ko 方式。 Knockout 将您从这种编码风格中解放出来，您只需要 grok 它。

提示：

使用点击绑定和css绑定

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

顺便说一句，您也可以这样做：

 $.getJSON(productsQuery).done(viewmodel.products);

【讨论】：

感谢您提供代码缩短提示，我会将其应用于问题的代码以缩短它。我会研究你的提示并在我的代码中尝试一下。