Javascript 如何更改Ajax生成的HTML内容

您好，我在更改由AJAX生成的HTML内容时遇到问题

这是页面的代码：

@model IEnumerable<WE_SRW_PeerNissen.Models.Reservations>

@{
    ViewBag.Title = "List";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Übersicht Liste</h2>


<form method="post" action="List">
    <div class="input-group">
        <div class="input-group-btn">
            <input type="text" class="form-control" name="searchbar" placeholder="Search">

            <button class="btn btn-default" type="submit">
                <i class="glyphicon glyphicon-search"></i>
            </button>
        </div>
    </div>
</form>

<table class="table" id="sorttable">
    <thead bgcolor="white">
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.BookingNr)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Arrival)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Departure)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Appartment)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Adult)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Children)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Total)
            </th>
        </tr>

    </thead>

</table>
<link href="~/Content/DataTables/css/jquery.dataTables.min.css" rel="stylesheet" />
<script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script>
    <script>
    $(document).ready(function () {
        $('#sorttable').DataTable({
            "ajax": {
                "url": "/OverView/loaddata",
                "type": "GET",
                "datatype": "json"
            },
            "columns": [
                { "data": "BookingNr", "autoWidth": true },
                { "data": "Arrival", "autoWidth": true },
                { "data": "Departure", "autoWidth": true },
                { "data": "Name", "autoWidth": true },
                { "data": "Appartment", "autoWidth": true },
                { "data": "Adult", "autoWidth": true },
                { "data": "Children", "autoWidth": true },
                { "data": "Total", "autoWidth": true },
            ]
        });
    });

</script>

@model IEnumerable
@{
ViewBag.Title=“列表”；
Layout=“~/Views/Shared/_Layout.cshtml”；
}
Übersicht Liste
@Html.DisplayNameFor（model=>model.BookingNr）
@DisplayNameFor（model=>model.Arrival）
@DisplayNameFor（model=>model.department）
@DisplayNameFor（model=>model.Name）
@DisplayNameFor（model=>model.Appartment）
@DisplayNameFor（model=>model.成人）
@DisplayNameFor（model=>model.Children）
@DisplayNameFor（model=>model.Total）
$（文档）.ready（函数（）{
$（'#排序表'）。数据表({
“ajax”：{
“url”：“/概述/加载数据”，
“类型”：“获取”，
“数据类型”：“json”
},
“栏目”：[
{“data”：“BookingNr”，“autoWidth”：true}，
{“data”：“Arrival”，“autoWidth”：true}，
{“数据”：“离开”，“自动宽度”：true}，
{“data”：“Name”，“autoWidth”：true}，
{“数据”：“公寓”、“自动宽度”：true}，
{“数据”：“成人”，“自动宽度”：true}，
{“data”：“Children”，“autoWidth”：true}，
{“data”：“Total”，“autoWidth”：true}，
]
});
});

生成的示例如下：

<div class="dataTables_filter" id="sorttable_filter">
     <label>Search:
           <input aria-controls="sorttable" type="search" placeholder="">
     </label>
</div>

搜索：

我认为这是我最好的尝试：

<script>
    $(document).ready(function () {
        $(document).on(function () {
            $('#sorttable_filter label:eq(1)').text('Suchen:');
        });
    });
</script>

$（文档）.ready（函数（）{
$（文档）.on（函数（）{
$（“#可排序的过滤器标签：等式（1）”）.text（'Suchen:'）；
});
});

我在AJAX脚本下面设置了它，我还尝试将它放在下面相同的脚本标记中，以确保AJAX被执行

一些注释

方法将函数绑定到特定事件，如：$（something）.on（“单击”，doSomething），您只提供了一个函数，因此它不知道将函数绑定到哪个事件

然后，eq（1）是jQuery方法，但不是CSS选择器，因此您希望使用“label:first child”（如果您需要第一个）。然而，它将破坏示例HTML中的输入字段，因为它位于label元素内部，所以您（可能）希望将其置于外部。在无法更改HTML输出的情况下，可以使用“移动”标签元素外部的输入副本的肮脏攻击。。。像这样

$（文档）.ready（函数（）{
var labelEl=document.querySelector（“#sorttable_过滤器标签：第一个子项”）；
变量输入=标签查询选择器（“输入”）；
labelEl.parentNode.appendChild（inputEl）；
labelEl.innerText='Suchen:'；
});一些注释

方法将函数绑定到特定事件，如：$（something）.on（“单击”，doSomething），您只提供了一个函数，因此它不知道将函数绑定到哪个事件

然后，eq（1）是jQuery方法，但不是CSS选择器，因此您希望使用“label:first child”（如果您需要第一个）。然而，它将破坏示例HTML中的输入字段，因为它位于label元素内部，所以您（可能）希望将其置于外部。在无法更改HTML输出的情况下，可以使用“移动”标签元素外部的输入副本的肮脏攻击。。。像这样


$（文档）.ready（函数（）{
var labelEl=document.querySelector（“#sorttable_过滤器标签：第一个子项”）；
变量输入=标签查询选择器（“输入”）；
labelEl.parentNode.appendChild（inputEl）；
labelEl.innerText='Suchen:'；
});
datatable有一个设置对象，您可以通过它为显示的按钮指定文本。阅读数据表手册。关于jquery选择器失败的原因——执行代码时，目标元素很可能不在DOM中。正如我所说，阅读datatables文档。当您在（…）上使用
时，
是否缺少事件参数？我对java和jquery、AJAX非常陌生。我在C#方面还不错。。。对于一个学生来说。我必须使用java、jquery和AJAX一次，但我想了解更多。datatable有一个设置对象，您可以通过它为显示的按钮指定文本。阅读数据表手册。关于jquery选择器失败的原因——执行代码时，目标元素很可能不在DOM中。正如我所说，阅读datatables文档。当您在（…）上使用
时，
是否缺少事件参数？我对java和jquery、AJAX非常陌生。我在C#方面还不错。。。对于一个学生来说。我必须使用java、jquery、AJAX一次，但我想了解更多。哦，非常感谢你，也许你在我们的项目中为我节省了1.0（德国系统最佳分数）。这当然是离题了，但我建议你在显示代码时删除名称空间，因为可能会出现一些NDAGrüße aus MünchenOh非常感谢您，也许您在我们的项目中为我保存了1.0（德国系统最佳分数）。这肯定是离题的，但我建议您在显示代码时删除名称空间，因为可能存在一些NDA格吕厄·奥斯·明钦