jquery - 与 JQuery 的共享点 - 单击列过滤器时停止工作

Question

我正在使用一个代码为共享点列表中的元素行着色。 当我过滤 ListView 中的一列时 - JQuery 停止工作......我需要向代码中添加什么或以不同的方式编写？

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Approved')"); $Text.parent().css("background-color", "#01DF3A");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Rejected')");
        $Text.parent().css("background-color", "#F90101");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Pending')");
        $Text.parent().css("background-color", "#EAC117");
    });
</script>

Answer 1

“$(document).ready”函数只会在页面加载时运行一次。

当您过滤时，您正在重新创建表格内的 HTML 元素。因此，您的 jQuery 代码永远不会在这些新的 HTML 元素上运行。

在执行过滤后以及页面加载时，您需要调用函数按状态为单元格着色。

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

    var colorCellsByStatus = function() {
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Approved')");
        $Text.parent().css("background-color", "#01DF3A");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Rejected')");
        $Text.parent().css("background-color", "#F90101");
        $Text = $("td.ms-cellstyle.ms-vb2:contains('Pending')");
        $Text.parent().css("background-color", "#EAC117");
    }