使用 jquery 更改 DataTable 中 <th> 的 css 值答案

【问题标题】：Changing css value of <th> in DataTable with jquery使用 jquery 更改 DataTable 中 <th> 的 css 值
【发布时间】：2017-07-11 11:49:21
【问题描述】：

我正在使用 dataTables，我想在满足特定要求时将 th 的字体颜色更改为红色，但它不起作用。此 th 显示一列的总和。通过 DataTables api 使用 ajax 动态插入数据。

如果我更改要在其上执行 .css("color", "red") 的元素，只要它在表格之外就可以工作。

jquery

desna = $('#skupina').DataTable({
    "paging": false,
    "scrollY": "700px",
    "scrollCollapse": true,
    //stateSave: true,
    bInfo: false,
   "columnDefs": [
        {
            "targets": [ 1 ],
            "visible": false,
            "searchable": false
        }],    
    "footerCallback": function ( row, data, start, end, display ) {
        var api = this.api(), data;

        // Remove the formatting to get integer data for summation
        var intVal = function ( i ) {
            return typeof i === 'string' ?
                i.replace(/[\$,]/g, '') * 1 : typeof i === 'number' ? i : 0;
        };

        // Total over all pages
        total = api
            .column( 3 )
            .data()
            .reduce( function (a, b) {
                return intVal(a) + intVal(b);
            }, 0 );

        // Total over this page
        pageTotal = api
            .column( 3, { page: 'current'} )
            .data()
            .reduce( function (a, b) {
                return intVal(a) + intVal(b);
            }, 0 );

        // Update footer
        $( api.column( 3 ).footer() ).html(
            pageTotal +' kg'
        );
    }
});
$('#druga').on("change", "#vozilo", function () {
     var g = $('#grupa').val();
    max_kg = parseInt($(this).children(":selected").attr("id"));
    if(max_kg<pageTotal){
        alert("nope");
        $("#foto").css( "color", "red"  );
    };
});

php

function zaglavlje($row, $rbr) {

echo '<thead>';
echo '<tr>
    <th>Adresa</th>
    <th>Grad</th>
    <th>Drzava</th>
    <th><input type="checkbox" id="all'.$rbr.'" align="center"/></th>

</tr>
<tfoot>
        <tr>
            <th colspan="10" id="foto" contenteditable="true"></th>
        </tr>
    </tfoot>';
echo '</thead>';

}

【问题讨论】：

没有代码，我们帮不了你...
把你的代码放在这里。
添加运行示例代码
尝试在 CSS 中添加负责颜色的类——这样更可靠
什么是#druga 和#grupa？在我看来，max_kg<pageTotal 永远不会被评估为真。由于#foto 存在，没有其他原因导致css() 不起作用。除此之外，您的 HTML 格式错误。 <tfoot> 里面有 <thead> ....

标签： jquery html css datatables

【解决方案1】：

我给了这个类，当我在那个类上调用 .css() 时它起作用了。

【讨论】：

很难相信css() 在现有的类上工作，而不是在现有的 id 上工作。事实上这是完全不可能的:)

【解决方案2】：

我想你正在寻找

    $('#example').dataTable( {
    "drawCallback": function( settings ) {
      $('#example tr:eq(0) th:eq(0)').text("Text update by code");
    }
  } );

如果您想使用 DataTable 设置列然后请click Here

【讨论】：