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

Question

我使用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，但我不确定为什么？

Answer 1

文档完成渲染后，

$(document).ready()触发。因此，如果您已经呈现了页面并且现在正在与它进行交互，则在您重新加载页面之前，该ready语句不再具有任何相关性。所以，不要把它放在一个函数中。

只需在功能块内调用mixItUp代码即可。

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

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

Answer 2

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

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

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