在不使用jQuery的情況下，通過AJAX加載html元素后，如何在JavaScript中執行函數？

Question

通過AJAX加載頁面的一部分后，我需要執行給定的javascript函數。 我無法控制頁面的加載方式，因此無法觸發頁面中的事件，我想我需要檢查主體以查找所需的元素，然后在該元素存在后執行。

我看到可以使用jQuery“ .on”方法執行此操作，但是我的jQuery版本是在引入此功能之前的版本，因此我無法使用它。 不使用第三方庫執行此操作的最佳方法是什么？

這是使用jQuery的示例：

//bind to the body a "load" handler for elements that have class names of "hello"
$('body').on('load','.hello',function(){
  alert("Hello is fully loaded, proceed with your program logic");
})

PS：發布此問題之前，我已經閱讀了相關問題。 如何將函數綁定到通過Ajax加載的Element

Answer 1

您可以創建一個函數，以在元素加載時調用，還可以創建另一個函數以檢查是否以一定間隔加載元素。 然后將負載檢查功能附加到主體的onload屬性。 例如：

<body onload="checkLoaded()">

<script type="text/javascript">
    var afterLoaded = function() {
        // code to execute once elements are in place
        console.log("Elements loaded.");
    };

    var checkLoaded = function() {
        var interval = setInterval(function() {
            if(document.getElementsByClassName("hello").length) {
                clearInterval(interval);
                afterLoaded();
            }
        }, 1000);
    };
</script>

Plunker

在不使用jQuery的情況下，通過AJAX加載html元素后，如何在JavaScript中執行函數？

問題描述

1 個解決方案

解決方案1
2 已采納 2014-05-14 17:57:10

在不使用jQuery的情況下，通過AJAX加載html元素后，如何在JavaScript中執行函數？

問題描述

1 個解決方案

解決方案1 2 已采納 2014-05-14 17:57:10

解決方案1
2 已采納 2014-05-14 17:57:10