Question

我在文档加载时调用了一个事件，以便能够使用Class＆＃39;标题点击每个元素。展开并显示更多细节：

$(document).ready(function () {
    InitClick();
});

这是功能：

function InitClick() {
    $('.header').click(function () {
        $(this).nextUntil('tr.header').slideToggle();
    });
}

现在的问题是，当结果被过滤时，它将导致该点击事件停止，直到我重新初始化它，然后它将再次开始工作......直到数据再次被过滤或必须更新。< / p>

现在我的主要问题是，有没有人得到一些可以帮助我的东西的链接，我已经尝试过把手放在$ watch上但是我一直有的主要问题是在过滤数据之前调用它返回，导致它在数据存在之前初始化。

如果它有帮助，这是MyApp.js吗？

var MyApp = angular.module('MyApp', []);

MyApp.controller('MyAppCtrl', function ($scope, $filter) {
    $scope.Users = tJSONData;
    $scope.currentPage = 0;
    $scope.pageSize = 3;
    $scope.Pages = [];

    $scope.search = '';
    $scope.Completed = '';


    $scope.getData = function () {
    return $filter('filter')($scope.Users, $scope.search ||     $scope.Completed);
    }

    $scope.numberOfPages = function () {
        return Math.ceil($scope.getData().length / $scope.pageSize);
    }

    $scope.$watch('numberOfPages()', function (newVal, oldVal) {
        var tPages = [];
        for (i = 0; i < $scope.numberOfPages(); i++) {
            tPages.push(i + 1);
        }

        if ($scope.currentPage >= $scope.numberOfPages()) {
            $scope.currentPage = $scope.numberOfPages() - 1;
        }

        if ($scope.currentPage == -1) {
            $scope.currentPage = 0;
        }
        return $scope.Pages = tPages;
    })

    $scope.updatePage = function () {
        $scope.$apply(function () {
            $scope.Users = tJSONData
        })
    }

    $scope.limitPagination = function () {
        if ($scope.currentPage == 0) {
            return $scope.currentPage;
        } else if ($scope.currentPage == 1) {
            return $scope.currentPage - 1
        } else {
            return $scope.currentPage - 2;
        }
    }
});

MyApp.filter('startFrom', function () {
    return function (input, start) {
        start =+ start; //parse to int
        return input.slice(start);
    }
});

感谢任何帮助：）

Answer 1

简而言之，当您致电$(selector).click（或任何其他事件）时，它只会为通话时抓取的元素设置事件。如果元素被删除和替换（看起来像你的情况），新元素将不会自动拥有它。

不使用$(selector).click(callback)，而是使用$(document).on('click', selector, callback)

在你的情况下，看起来这应该可以解决问题：

$(document).on('click', '.header', function () {
    $(this).nextUntil('tr.header').slideToggle();
});

不同的是，这种方式，事件实际上绑定到document本身，它永远不会改变。然后你进行过滤，这样它只会在你点击一个.header时触发，但它会适用于所有这些，甚至是在这个位被调用后添加的那些。

文档单击过滤器上停止的事件

1 个答案: