在 ScriptManager.RegisterStartupScript 后面的代码中调用脚本后，jQuery document.ready 不会触发

Posted 2023-05-08

【中文标题】在 ScriptManager.RegisterStartupScript 后面的代码中调用脚本后，jQuery document.ready 不会触发

【英文标题】：jQuery document.ready doesn't fire after script called in code behind ScriptManager.RegisterStartupScript

【发布时间】：2015-06-09 14:15:52

【问题描述】：

我有一个使用 https://mixitup.kunkalabs.com/ 过滤的项目列表

例如查看屏幕

然后用户选择添加另一个操作 - 这使用 fancybox 作为弹出窗口并向用户显示下一个图像：

用户添加数据后，页面会使用更新面板进行部分回发。然后代码从后面的代码中调用一个 js 函数来关闭弹出窗口，然后调用 mixitup 函数来重新初始化列表，因为它现在有一个新项目，但它不起作用。

下面是调用js的代码

ScriptManager.RegisterStartupScript(Me, [GetType](), "Load", "ReloadData();", True)

这里是要调用的js：

function ReloadData() 
    parent.jQuery.fancybox.close();
    $(document).ready(function () 
        $('#Container').mixItUp(layout: display: 'block');
    );

fancybox 关闭，但 mixitup 从未被触发，因为它从未通过 docment.ready 测试，这意味着它没有加载，因此无法运行 jQuery，但我不确定为什么？

【参考方案1】：

$(document).ready() 在文档完成渲染后触发。因此，如果您已经呈现了您的页面并且现在正在与它进行交互，那么该 ready 语句将不再具有任何相关性，直到您重新加载页面。所以，不要把它放在一个函数中。

只需在功能块内调用您的mixItUp 代码。

function ReloadData() 
    parent.jQuery.fancybox.close();
    $('#Container').mixItUp(layout: display: 'block');

作为一个建议：如果您已经在使用 jQuery，请不要使用更新面板。只需通过 $.ajax 进行 ajax 调用。

【参考方案2】：

您应该将以下代码放在ReloadData() 函数之外。

$(document).ready(function () 
        $('#Container').mixItUp(layout: display: 'block');
    );

文档就绪功能应始终保持在顶层。另外请检查加载页面时是否有任何JS错误。