Question

所以，我有一个div（id =“content”），我正在加载从AJAX请求获得的各种其他HTML。我希望能够告诉他们何时成功加载，但加载事件似乎不适用于append（）。

我有这个简化的例子来说明情况（在实际情况下，'load'事件的监听器被注册在不同的文件中，这些文件被加载到脚本部分中）

<html>
<head>
    <script
        type="text/javascript"
        src="http://code.jquery.com/jquery-latest.min.js">
    </script>
</head>

<body>
    <div id="content"><div>
    <script type="text/javascript">
        $(document).ready( function () {
            // this does not seem to work
            $("#myDiv").on('load', function () {
                console.log("myDiv loaded");
            });

            // neither does this
            $("#content").on('load', "#myDiv", function () {
                console.log("myDiv loaded by delegation");
            });

            // the content to append will come from the network
            $("#content").append($("<div id='myDiv'>myDiv</div>"));
        });
    </script>
</body>
</html>

当然，在实际情况下，事情更复杂（加载的数据可以是任何东西）所以这些都不是有效的选项：

在div加载后调用函数
在加载的代码中嵌入了一个函数（代码是从模板文件生成的）

Answer 1

如果从Ajax请求中获取数据，则应该实际使用Ajax done（）函数。由于调用是异步的，因此您无法收听div中的更改。另一种解决方案是在div上添加一个body委托，让它监听change事件。

$("body").delegate("mydividentifier", "change", function(f){});
$.ajax().done(function(f){});

使用jQuery捕获append（） - ed元素的元素“load”事件？

1 个答案: