Javascript dataTables正在工作，但子行上没有jQuery

我的同事建议我使用data tables.net中的dataTables作为快速插入任何动态表的工具，用于搜索排序目的，这种方法很好地解决了问题

问题是，我希望它是有响应的，所以当查看表格时，它会折叠，然后像网站上的例子一样，当屏幕宽度很小时，它会变成几列，按下按钮显示隐藏的列。当我自己尝试这个的时候，我得到了折叠的柱子，但是没有能力看到隐藏的柱子

我使用CODEGITENT+基金会5来构建表。

我的一个HTML/PHP表格示例

<div class="small-12 medium-12 large-12 columns" align="center">

<table id="table_request" cellspacing="0" width="100%%">
    <thead style="background-color: #2573A6">
    <th>Customer Name</th>
    <th>Email Address</th>
    <th>Telephone Number</th>
    <th>Quote Message</th>
    <th>House Num</th>
    <th>Postcode</th>
    <th>Quote Day</th>
    <th>Accept</th>
    <th>Reject</th>
    </thead>

    <tbody>

    <?php foreach ($quotes as $request) {
        $i = $request->id;
        $dayz = date("y-m-d",strtotime("-3 day"));
        $week = date("y-m-d",strtotime("-10 day"));
        if(strtotime($request -> day) < strtotime($dayz))
        {
            echo "<tr class='tbl_row_$i' style='background-color: #ffff00  '>";
        }
        elseif (strtotime($request -> day) < strtotime($week))
        {
            echo "<tr class='tbl_row_$i' style='background-color: #990000  '>";
        }
        else
        {
            echo "<tr class='tbl_row_$i' style='background-color: #ffffff '>";
        }
        echo "<input type='hidden' value='$i' name='rowid_$i' id='row_id_$i'>";
        echo "<input type='hidden' value='$request->house_post' id='postcode_$i'>";
        echo "<input type='hidden' value='$request->house_num' id='house_num_$i'>";
        echo "<input type='hidden' value='$request->name' id='name_$i'>";
        echo "<input type='hidden' value='$request->email' id='email_$i'>";
        echo "<input type='hidden' value='$request->tel_num' id='telnum_$i'>";
        echo "<td>" . $request->name . "</td>";
        echo "<td><a href='mailto:$request->email'>" . $request->email . "</a></td>";
        echo "<td><a href='tel:$request->tel_num'>" . $request->tel_num . "</a></td>";
        echo "<td style='width: 40%'>" . $request->message . "</td>";
        echo "<td>" . $request->house_num . "</td>";
        echo "<td>" . $request->house_post . "</td>";
        echo "<td>" . date('F d, Y', strtotime($request->day)) . "</td>";
        echo "<td><button type='submit' name='but_accept_$i' num='$i' class='accept_button tiny'>Accept</button></td>";
        echo "<td><button type='submit' name='but_reject_$i' num='$i' class='reject_button tiny'>reject</button></td>";
        echo "</tr>";

    }
    ?>
    </tbody>
</table>

我试图复制网站示例中的信息，但它崩溃了，无法看到隐藏的列

提前感谢您的帮助

更新：

拒绝按钮示例

$(".reject_button").click(function (e) {
        var count = $(this).attr('num');
        var row_id = $("#row_id_" + count).attr('value');
        var name = $("#name_" + count).attr('value');
        var email = $("#email_" + count).attr('value');
        var tel = $("#telnum_" + count).attr('value');
        var house = $("#house_num_" + count).attr('value');
        var postcode = $("#postcode_" + count).attr('value');
        $.ajax({
            url: "<?php echo base_url();?>admin/reject_job",
            type: 'POST',
            data: {row_id: row_id, name: name, email: email, telnum: tel, house: house, postcode: postcode},
            success: function () {
                $(".tbl_row_" + count).css("background-color", "#FF0000");//red
                alert("Job Rejected");
            },
            error: function () {
                alert("Error");
            }
        })
    })

---

当在小屏幕上的子行中，并且当不在子行中时，将传递空白时，此选项将不再起作用。因此，在示例站点上查看表格时，创建绿色按钮的css选择器如下所示：

table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before

---

因此，第一个子选择器不起作用，因为在所有列之前都有隐藏的输入。尝试将隐藏的输入移动到其他地方，比如在所有的输入之后。请参阅。

您可以使用fnDraw；datatables api提供的函数…参见文档：我不确定这意味着要实现什么，出于好奇，我尝试了它，但没有出现任何错误，也没有解决缺少查看隐藏儿童功能的问题。感谢您的反馈，是的，隐藏的输入是我非常欣赏的问题，现在的问题是，按钮的DOM被隐藏在子级中，它不再识别附加到它的jQuery。添加了一点jQuery，它已经停止运行，认为这与表如何自我更改有关

table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before