我是knockout.js的新手。我有一个代码，我正在调试。我面临的问题对我来说是非常新的。一个删除按钮被放置在一个div中，它的目的是删除相应的部分。我观察到一个奇怪的事情。如果页面在100%缩放，如果页面有10个部分。假设3个部分是可见的，7个部分是不可见的。在用户视图中隐藏的部分不会在点击删除按钮时被删除。2相反，在这7个部分中点击删除按钮时，焦点到达页面的顶部。
如果我把缩放比例降低到60%，页面上会显示7个部分，隐藏3个部分。现在我可以删除7个部分，没有任何问题。但是删除对用户不可见的3个部分不起作用。只要我从顶部删除几个部分，那么当最后3个部分对用户可见时，那么用户也可以删除这些部分。我不明白是什么问题。下面的代码只有一个这样的块。

<div class="well border-editable field-container" data-bind="foreach: fields">
<!-- ko if: !$parent.isApproved && !$parents[1].isCloned -->
    <div class="hover-icon field" data-bind="drag: $parent.reorderField">
        <div class="well well-xs border-bar field-body clearfix" data-bind="event: {mouseleave: closeTooltip}">
            <div class="field-operation" data-bind="visible: id != $parent.editingField().id">
                <span class="field-operation-item">
                    <!-- ko if: $parents[1].status != 'distributed' -->
                    <!-- ko if: type() != 'outcome' && type() != 'cm' && type() != 'am' && type() != 'al'-->
                    <a href="#" class="tooltip_trigger" data-bind="sure: $parent.removeField, btnText: 'Delete', tipText: 'Are you sure?'" data-placement="top" title="Delete" tabindex="0">
                        <i class="icon icon-trash-empty"></i>
                    </a>
                    <!-- /ko -->
                    <!-- ko if: (type() == 'outcome' && !$parents[1].cmField()) || 
                                (type() == 'cm' && !$parents[1].amField()) || 
                                (type() == 'am' && !$parents[1].afField()) ||
                                (type() == 'al' && !$parents[1].alfField()) --><!-- /ko -->
                    <!-- ko if: type() == 'outcome' && $parents[1].cmField() --><!-- /ko -->    
                    <!-- ko if: type() == 'cm' && $parents[1].amField() --><!-- /ko -->    
                    <!-- ko if: type() == 'am' && $parents[1].afField()  --><!-- /ko -->  
                    <!-- ko if: type() == 'al' && $parents[1].alfField()  --><!-- /ko --> 
                    <!-- /ko -->
                    <!-- ko if: $parents[1].status == 'distributed' --><!-- /ko -->
                </span>
            </div>
            <div data-bind="template: { name: 'field-' + type(), data: $data }">
                <!-- ko if: id !== $parents[1].editingField().id -->
                <div class="form-horizontal">
                    <div class="form-group">
                        <div class="col-md-12">
                            <label class="text-primary" data-bind="text: label">Number</label>
                            <p class="help-block" data-bind="text: description"></p>
                        </div>
                        <div class="col-md-3">
                            <div class="fake-text" data-bind="text: value"></div>
                        </div>
                    </div>
                </div>
            <!-- /ko -->
            <!-- ko if: id === $parents[1].editingField().id --><!-- /ko -->
            </div>
        </div>
    </div>
    <!-- /ko -->
<!-- ko if: $parent.isApproved || $parents[1].isCloned --><!-- /ko -->

下面是javascript代码：（如果您需要任何其他信息，请告诉我）

function removeField () {
        var activeSection = _getActiveSection();
        activeSection.removeField(removeFieldModel);
    }
    function _getActiveSection () {
        var activeSectionId = self.activeSectionId();
        var sections = self.displaySections();
        return  _.find(sections, function (section) {
            return section.id == activeSectionId;
        }) || sections[0] || {};
    }
    self.displaySections = ko.pureComputed(function () {
        return _.union(ko.unwrap(self.linkedSections), ko.unwrap(self.sections));
    });

我不知道你们需要什么额外的代码来帮助我调试这个。如果你需要任何其他信息，请告诉我。
这里是一个视频演示什么我试图解释。VIDEO DEMO LINK

• 谢谢-谢谢