javascript - 如何替换 $(document).ready 函数？

Question

我遇到了问题，但不知道如何解决。A有以下js脚本:

$(function () {
    $.ajaxSetup({ cache: false });
        var timer = window.setTimeout(function () {
        $(".alert").fadeTo(1000).slideUp(1000, function () {
            $(this).hide();
        });
    }, 3000);
    $(document).on("click", "[data-hide]", function () {
        if (timer != null) {
            clearTimeout(timer);
            $(this).closest("." + $(this).attr("data-hide")).hide();
        }
    });
});

<div class="well">
    <h3>
        <strong>@Model.Name</strong>
        <span class="pull-right label label-primary">@Model.AverageRaiting.ToString("# stars")</span>
    </h3>
    <span class="lead">@Model.Description</span>
    @Html.DialogFormLink("Update", Url.Action("UpdatePhoto", new {id = @Model.PhotoId}), "Update Photo", Url.Action("Photo"))
    @Html.Action("InitializeAlerts")//When this action is executing the document was already ready (by the first time when full page was loading), so I have no chanse to catch any .alerts in js alert file after updating this partial for another one.
</div>

有时，我会遇到这样的情况:文档比我的部分 View 中的任何 .alert 类更早准备好。那么，如何重写该函数以在使用有效的 .alert 更新我的部分 View 后执行它？

Answer 1

您要么需要等待 $(",alert") 首先存在，要么需要在加载处理中添加代码。

如果您不希望紧密耦合 JS 文件，您可以从其他脚本广播“面板加载”事件，您可以在文档级别捕获该事件。

例如

$.ajax({...}).done(function(loadedhtml){
    $somepanel.html(loadedhtml);
    $(document).trigger("panelloaded", $somepanel);
});

并在主程序中监听通用的“面板加载”事件:

例如

$(document).on('panelloaded', function(panel){
    // Do stuff here to the newly loaded panel
});