jQuery的淘汰賽綁定

Question

我有一張桌子，下面有兩個列。

問題：當我在文本框中嘗試Jquery blur事件時，它在第一行有效，但是當我添加新行（將新行推入可觀察數組）時。 blur事件對新行沒有任何影響。

我正在使用Knockout.js

JQUERY

jQuery("#2CrpAcrs").blur(function () {
    var numb = $("#2CrpAcrs").val();
    numb = Math.round(numb * 100) / 100
    $("#2CrpAcrs").val(numb);
})

的HTML

<tbody data-bind="foreach:Sec2">
                <tr>
                    <td>
                        <button class="btn btn-xs btn btn-danger" type="button" data-bind="click: $root.Sec2_RemoveRow">Remove</button>
                    </td>
                    <td>
                        <select class="form-control" data-bind="options: CrpType, value: CrpType,optionsValue:'value', optionsText:'crop'"></select>
                    </td>
                    <td>
                        <input id="2CrpAcrs" class="form-control" type="text" data-bind="value: NumAcres">
                    </td>
                </tr>
            </tbody>

Answer 1

編輯：請參閱下面我的編輯。 我建議重新考慮您的代碼

使用Knockout進行此類操作的方法是使用自定義綁定處理程序： http : //knockoutjs.com/documentation/custom-bindings.html

我想你會做這樣的事情：

ko.bindingHandlers.yourBindingName = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        // This will be called when the binding is first applied to an element
        // Set up any initial state, event handlers, etc. here
        $(element).blur(function () {
            var numb = $(this).val();
            numb = Math.round(numb * 100) / 100
            $(this).val(numb);
         });
    },
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        // This will be called once when the binding is first applied to an element,
        // and again whenever any observables/computeds that are accessed change
        // Update the DOM element based on the supplied values here.
    }
};

然后，您可以在元素中執行以下操作：

<input id="2CrpAcrs" class="form-control" type="text" data-bind="value: NumAcres, yourBindingName: {}">

另外，您當前的代碼會導致多個具有相同ID的元素，這是無效的。 考慮為2CrpAcrs使用類而不是ID。 這可能是您當前問題的一部分。

編輯：

為什么要使用jQuery？ 為什么不直接訂閱您的價值觀？ 這就是淘汰賽。 您可以訂閱將數據綁定到輸入元素的任何內容，並對所需的值進行任何自定義處理。

Answer 2

.blur僅綁定到現有行。 使用事件委托。

jQuery(document).on("blur", "#2CrpAcrs", function () {

順便說一下，ID必須是唯一的，因此您不應使用#2CrpAcrs ，而應使用類。 與添加行的表上的document例如類或ID）相比，使用更具體的選擇器也更好。