Javascript 为什么部分视图中的jQuery脚本不工作？

（我将省略一些我100%确定的代码，以使代码更紧凑）我有一个主视图（主视图没有任何html头体，因为它包含在布局中）

…还有一些CSS：

.download-result {
    display: none;
}

    .download-result.active {
        display: block;
    }

---

通常，我的任务是下载文件并显示文件已成功下载。文件下载正常，没有问题。我的问题是

showDownloadResult（rowIndex）

函数没有按预期工作。Chrome调试器使用正确的

行索引点击它，但既不删除
活动的
类，也不添加它。我在JSFIDLE中检查了该函数——它在那里按预期工作，但在我的局部视图中没有。我做错了什么？
您的局部视图是否使用JS动态更新？如果是这种情况，那么将不执行$（document）.ready，您需要自己在新的html上执行$（document）.on。@the_lotus我明白您的意思了。嗯，是的，我的部分视图是通过HTML更新的（我有一个
$（“#user files table wrapper”）.HTML（数据）；
在我的一些JS中。但是我必须做些什么才能让它工作呢？你能给我举个例子吗？我对这些问题没有实际经验
<h3>User files ("Delete" and "Download" buttons can be clicked with invalid XML files only)</h3>
<table id="user-devices-table">
    <tr>
        <th>User file</th>
        <th>Assigned email</th>
        <th>Is valid</th>
        <th>Delete button</th>
        <th>Download button</th>
    </tr>
    @foreach (var userFileViewModel in Model)
    {
        @foreach (var file in userFileViewModel.UserFiles)
        {
                if (isValid == false && isXml)
                {
                    <tr class="user-file-row invalid">
                        <td>@file.FileName</td>
                        <td>@userFileViewModel.Email</td>
                        <td>@file.IsValid</td>
                        <td>
                            <a class="btn btn-danger" asp-controller="Admin" asp-action="Delete" asp-route-userFileId="@file.UserFileID" asp-route-fileName="@file.FileName">Delete</a>
                        </td>
                        <td>
                            <input type="button" id="@file.FileName" class="btn btn-primary download-button" value="Download" />
                            <p class="download-result">File has been downloaded successfully</p>
                        </td>
                    </tr>
                }
            }
        }
    }
</table>

$(document).ready(function () {
    $(document).on("click", ".btn.btn-primary.download-button", function () {
        const fileName = $(this).attr("id");
        const clickedButtonRowIndex = $("input[type='button']").index(this);

        downloadUserFile(fileName, clickedButtonRowIndex);
    });
});

function downloadUserFile(fileName, rowIndex) {
    $.ajax({
        url: "/Admin/Download",
        data: { fileName: fileName },
        success: function (data) {
            processProvidedFile(data, fileName);
            showDownloadResult(rowIndex);
        },
        error: function (error) {
            alert(`An error occured: ${error.responseText}`);
        }
    });
}

function processProvidedFile(data, fileName) {
    fetch(data)
        .then(resp => resp.blob())
        .then(blob => {
            const url = window.URL.createObjectURL(blob);
            const a = document.createElement("a");
            a.style.display = "none";
            a.href = url;
            a.download = fileName;
            document.body.appendChild(a);
            a.click();
            window.URL.revokeObjectURL(url);
        })
        .catch(() => alert("An error occured"));
}

function showDownloadResult(rowIndex) {
    $(".download-result.active").removeClass("active");
    $(".download-result").eq(rowIndex).addClass("active");
}

.download-result {
    display: none;
}

    .download-result.active {
        display: block;
    }