Javascript在数据表的第二页不起作用

实际上，我正在使用以下数据表：

数据表代码：
{{'fsaGeneralPlan.table.Auditors'| trans（{}，'FSABundle'）}
{{'fsaGeneralPlan.table.Audits'| trans（{}，'FSABundle'）}
{{'fsaGeneralPlan.table.Areas'| trans（{}，'FSABundle'）}}
{%用于auditsByArea%中的审核}
{%set myArray=audit.Audits | split（'，'）%}
{%set AuditsStatus=audit.AuditsStatus | split（'，'）%}
{{audit.Auditor}}
{{{%set long=numberOfAudits}长度+2%}}
{{{long}}}
{0..3%中的i为%1}
{%set e=i+1%}
{{'w'~e}
{#  #}
{%endfor%}
{{audit.area_name}
{%endfor%}

我使用Javascript在加载页面后更改datatable中的按钮类：

 <script type="text/javascript">
        $(document).ready(function(){


             $(".auditButton.Submitted").removeClass('btn-outline-primary');
             $(".auditButton.Submitted").addClass('btn-outline-success');
             $(".auditButton.Expired").addClass('btn-outline-danger');
             $(".auditButton.Capturable").addClass('btn-outline-warning');
        });

$（文档）.ready（函数（）{
$（“.auditButton.Submitted”）.removeClass（'btn-outline-primary'）；
$（“.auditButton.Submitted”）.addClass（'btn-outline-success'）；
$（“.auditButton.Expired”）.addClass（'btn-outline-danger'）；
$（“.auditButton.Capturable”）.addClass（'btn-outline-warning'）；
});

它工作正常，但仅在datatable的第一页中，在其他页中不工作

---

有没有关于如何修复或是什么问题的想法或主题？

您需要收听表格的

绘制事件

为什么?？
您当前的设置在第一页可以正常工作，因为这些元素都是在激发
$（document）.ready（）
时呈现的。但是，其他页面将在文档准备就绪后呈现

尝试：

这样，您还可以从`$（文档）中删除相同的代码块

如果愿意，还可以将所有这些内容放在datatable的draw回调中：

const table = $('#dataTable').DataTable({
    drawCallback: function(settings) {
        // changes in here
    }
});

但如果删除$（document）.ready（），则控制台$（…）中会出现错误。DataTable不是function@IrvingSotoGuzman应该是一个简单的修复！让我们将我给您的整个代码块放入
$（document）.ready（）
.thaaaanks！它可以工作，只是有一个小问题，它可以工作，直到我更改datatable的页面，但我会检查它，因为现在它更改了按钮的类别：）Draw是在进行筛选或更改页面后自动重新绘制datatable，但是您知道如何应用相同的概念而不进行筛选或更改排序吗@Cameron@IrvingSotoGuzmandraw事件适用于每当绘制表时（例如，当它第一次加载、排序更改或分页时），我相信这会回答您的问题吗？如果要强制绘制事件，可以调用
$（'#dataTable'）.dataTable（）.draw（）
const table = $('#dataTable').DataTable();

// Event listener for DT 1.10+
table.on('draw', function() {
    $(".auditButton.Submitted").removeClass('btn-outline-primary');
    $(".auditButton.Submitted").addClass('btn-outline-success');
    $(".auditButton.Expired").addClass('btn-outline-danger');
    $(".auditButton.Capturable").addClass('btn-outline-warning');
});

const table = $('#dataTable').DataTable({
    drawCallback: function(settings) {
        // changes in here
    }
});