页面重新加载时未命中更改功能
Posted
技术标签:
【中文标题】页面重新加载时未命中更改功能【英文标题】：Change function not being hit on page reload 【发布时间】：2021-06-02 00:33:11 【问题描述】：我有一个cshtml 视图，它在头部声明了一个 js 文档，在正文中加载了一个部分
<head>
<script src="~/js/Project/doc.js"></script>
</head>
和部分
<div class="panel" id="panelDoc">
<partial name="_docInformation" model=Model.Doc />
</div>
这个部分加载了一个包含各种表格和下拉列表的部分视图。 doc.js 具有以下功能，可以根据用户选择的文档类型再次获取页面上的信息，将panelDoc 中的html替换为新信息的部分：
$(document).ready(function ()
$('#docType').change(function ()
debugger;
// Get the selected document type from the dropdown via ID
var docType = $('#docType option:selected').val();
var form =
ProjectID: $('#ProjectID').val(),
DocType: docType
;
$.ajax(
url: '/Project/LoadDocumentPartial',
type: 'POST',
data: form,
success: function (result)
if (result.success != undefined && !result.success)
// Show error stuff
else
// Replace the current html in id with new html
$('#panelDoc').html(result);
);
);
);
这在第一次加载部分时有效，因为我可以更改下拉菜单并点击此功能，用新信息替换内容。但是，如果我再次更改下拉菜单，它永远不会点击此功能。
据我了解，我们将 js 文件包含在父视图中，每次下拉列表更改时都应该点击它？还是我在这里遗漏了什么？
【问题讨论】：
【参考方案1】：尝试对顶部的 javascript 函数使用不同的语法：
$(document).on("change", "#docType", (function (e)
e.preventDefault();
e.stopImmediatePropagation();
......
【讨论】：
似乎有效。原版没有的任何原因？ 当我使用带有 ajax 的局部视图时，我总是使用这种语法。另一个也从来没有为我工作过。当您重新加载部分视图时，以前的事件绑定会丢失。所以你必须将事件绑定到文档。以上是关于页面重新加载时未命中更改功能的主要内容，如果未能解决你的问题，请参考以下文章
DataTables.js - 表格在页面加载时未加载初始 100% 全宽