数据表Javascript链接无法在第二页上运行

我有一个表中的数据列表,并使用dataTable插件进行分页.

但是,我的上一栏是一个链接.当我转到第二页时,我无法单击该链接,但链接仅在表的第一页打开.

当我没有数据表所有链接的工作,但是当我添加它时它没有工作…

我的代码：

 <table id="PartsResultListGrid" class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.PartsRequestOrderNum)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Call_Num)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DetailView)
            </th>

        </tr>
    </thead>

    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.PartsRequestOrderNum)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Call_Num)
                </td>

                <td>
                    <div data-callno='@item.PartsRequestOrderNum' data-url="@Url.Action("GetPartsInfo", "Parts")">
                        <div class="PartsViewSubmit toolbarIcon">
                            <div class="toolbarIconText">View</div>
                        </div>
                    </div>
                </td>
            </tr>
        }
    </tbody>

</table>

使用Javascript：

<script type="text/javascript">
$(document).ready(function () {
    $('#PartsResultListGrid').dataTable({
        "bSort": false,
    });
});
</script>

知道为什么会这样吗？

我在这里打开链接的ajax链接：

        $('.PartsViewSubmit').click(function () {
        $.ajax({
            type: "GET",
            url: $(this).parent().data("url"),
            data: { PartsRequestOrderNum: $(this).parent().data("callno") },
            success: function (data) {
                $("#PartsDetail").html(data);
            },
        });
    });

解决方法:

你需要使用delegated event：

Delegated events have the advantage that they can process events from
descendant elements that are added to the document at a later time. By
picking an element that is guaranteed to be present at the time the
delegated event handler is attached, you can use delegated events to
avoid the need to frequently attach and remove event handlers.

所以在你的情况下,我会这样做：

$(document.body).on('click', '.PartsViewSubmit', function() {
    $.ajax({
        ...
    });
});

标签：javascript,jquery,jquery-datatables
来源： https://codeday.me/bug/20191003/1849585.html